<script>元素的几种常见属性：
async 异步加载，立即下载，不应妨碍页面其他操作，标记为 async 的异步脚本并不保证按照指定的先后顺序执行，因此异步脚本不应该在加载期间修改dom，异步脚本一定会在页面的 load 事件前执行，不一定在 domcontentloaded 事件前后触发，js有依赖性时，用async很容易出错，async 是无序执行，自身加载完就会执行；
domcontentloaded 事件于window的onload事件不同：
onload事件是ui事件，是window对象的onload，当页面完全加载后（包括所有的图片、js文件、css文件等外部资源），就会触发window的onload事件
domcontentloaded事件是html5事件，本来是document对象的事件，会冒泡到window对象，形成了完整dom树之后就会触发（不理会图片、js文件、css文件或其它资源是否已经下载完毕）
defer 延迟脚本，异步加载，立即下载，但脚本会延迟到整个页面都解析完毕后再运行，html5规范要求按照出现的前后顺序执行，并且会先于 domcontentloaded 事件触发前执行，现实当中 defer 脚本不一定按照顺序执行，也不一定会先于domcontentloaded事件前执行，因此最好只包含一个延迟脚本，defer 是有序执行
async与defer区别：
相同点： 都是异步加载，不阻塞页面渲染；都可以只使用属性名，不定义属性值；都只对外部脚本适用（ie7之前针对嵌入式脚本使用defer，ie8+只支持外部脚本）；
不同点： async 会在加载完成后立即执行，因此它是无序执行，但一定会在window的onload事件之前执行，domcontentloaded事件前后不确定；
defer 会等到整个页面解析完后再执行，一般会按照顺序执行，会先于domcontentloaded事件触发前执行；
js加载执行顺序：
如果没有async和defer属性，那么浏览器会立即执行当前js脚本阻塞后面的脚本；
如果有async属性，那么浏览器加载它会与加载其它资源并行进行，异步加载，它自身加载完毕后立马执行；
如果有defer属性，那么浏览器加载它也会与其它资源并行进行，异步加载，该脚本会被延迟到整个页面全部解析完毕后再执行；
domcontentloaded先于onload事件触发；
type 可以看做为language（已经弃用）的替代属性，该脚本语言的mime类型，默认为text/javascript；
src 要执行代码的外部文件；
<noscript>元素 只有在浏览器不支持脚本，或者支持脚本但被禁用时显示；
如对本文有疑问， 点击进行留言回复！！
egg项目npm/cnpm出错Connect timeout
我要评论
网友评论