详解JavaScript中的装载和执行

迷茫
リリース: 2017-03-26 15:14:56
オリジナル
1468 人が閲覧しました

承接前面一篇文章《浏览器的渲染原理简介》 ,本文来说下JavaScript的装载和执行。

通常来说,浏览器对于 JavaScript 的运行有两大特性:

1) 载入后马上执行

2) 执行时会阻塞页面后续的内容(包括页面的渲染、其他资源的下载)

所以,如果有多个JS文件被引入,那么对于浏览器来说,这些JS文件将被串行地载入并依次执行。

由于JavaScript 可能会操作 HTML文档的DOM 树,所以浏览器一般都不会像并行下载CSS文件一样并行下载JS文件,这是JS文件的特殊性造成的。因此,如果你的JavaScript想操作后面的DOM 元素,浏览器会报错说找不到对象,这是因为JavaScript执行时后面的HTML被阻塞住了,操作DOM 树时还没有后面的节点。

传统方式

当你写下如下代码时:

ログイン後にコピー

基本上来说,head里的

ログイン後にコピー

依此弹出的对话框为:

loadjs() exit...
loadjs() finished!
hello world
another block
ログイン後にコピー

然后才会显示页面。

script 的defer和async属性

IE自从IE6就之处defer 标签,如:

ログイン後にコピー

对于IE来说,这个标签会让IE并行下载JS文件,并且把其执行hold到了整个DOM装载完毕,多个defer 的

最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート
私たちについて 免責事項 Sitemap
PHP中国語ウェブサイト:福祉オンライン PHP トレーニング,PHP 学習者の迅速な成長を支援します!