异步加载JS
Posted 夜里码码
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了异步加载JS相关的知识,希望对你有一定的参考价值。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>异步加载js</title>
</head>
<body>
<script>
//异步加载JS函数
// 实现思想:动态创建script标签,插入到文档中,然后执行callback函数
//url为请求的JS文件的地址,callback为请求成功时的回调函数
function loadScript(url,callback){
//动态创建script标签
var script = document.createElement("script");
script.type = "text/javascript";
//判断外部的JS文件是否加载完成(此处需要解决浏览器的兼容问题)
if(script.readyState){
script.onreadystatechange = function(){
if(script.readyState == ‘loaded‘ || script.readyState == ‘complete‘){
script.onreadystatechange = null;
callback();
}
}
}else{
script.onload = function(){
callback();
}
}
script.src = url;
//执行脚本文件
document.body.appendChild(script);
}
//调试程序
// loadScript("1.js",function(){
// test();
// });
</script>
</body>
</html>
以上是关于异步加载JS的主要内容,如果未能解决你的问题,请参考以下文章
如何延迟或异步此 WordPress javascript 片段以最后加载以加快页面加载时间?