j***ascript自动加载***,js自动加载函数-北京沣登科技发展公司

大家好，今天小编关注到一个比较有意思的话题，就是关于javascript 自动加载事件的问题，于是小编就整理了2个相关介绍 java script自动加载***的解答，让我们一起看看吧。

js延迟加载的方式有哪些？
怎么判断js脚本加载完成？

js延迟加载的方式有哪些？

js延迟加载的方式有哪些？

js的延迟加载有助于提高页面的加载速度

div>

（图片来源网络，侵删）

1.defer属性

如果script标签设置了该属性，则浏览器会异步的下载该文件并且不会影响到后续DOM的渲染；
如果有多个设置了defer的script标签存在，则会按照顺序执行所有的script；
defer脚本会在文档渲染完毕后，DOMContentLoaded***调用前执行。

（图片来源网络，侵删）

文档解析时，遇到设置了defer的脚本，就会在后台进行下载，但是并不会阻止文档的渲染，当页面解析渲染完毕后。
会等到所有的defer脚本加载完毕并按照顺序执行，执行完毕后会触发DOMContentLoaded***。

2.async属性

async的设置，会使得script脚本异步的加载并在允许的情况下执行
async的执行，并不会按着script在页面中的顺序来执行，而是谁先加载完谁执行。

（图片来源网络，侵删）

怎么 判断js脚本加载完成？

由于html是解释型语言，一般的DOM构建顺序是这样子的：（HTML → head → title → #text(网页标题) → style → 加载样式 → 解析样式 → link → 加载外部样式表文件 → 解析外部样式表 → script → 加载外部脚本文件 → 解析外部脚本文件 → 执行外部脚本 → body → div → script → 加载脚本 → 解析脚本 → 执行脚本 → img → script → 加载脚本 → 解析脚本 → 执行脚本 → 加载外部图像文件 → 页面初始化完毕）