这篇文章主要介绍如何动态加载JavaScript文件,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!
一、使用document.write/writeln()方式
该种方式可以实现js文件的动态加载,原理就是在重写文档流,这种方式会导致整个页面重绘。
实现方式:
document.writeln("<script src=\"http://lib.sinaapp.com/js/jquery/1.6/jquery.min.js\"></script>");
需要注意的是特殊字符的转义。
二、使用jQuery
使用getScript(url,callback)方法实现动态加载js文件
$.getScript('test.js',function(){ alert('done'); });
三、使用原生js方法
原理:动态创建script标签,并指定script的src属性
function loadJs(url,callback){ var script=document.createElement('script'); script.type="text/javascript"; if(typeof(callback)!="undefined"){ 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); } loadJs("test.js",function(){ alert('done'); });
还可以使用同样的原理动态加载css文件,只不过插入的的父节点是head标签。
以上是“如何动态加载JavaScript文件”这篇文章的所有内容,感谢各位的阅读!希望分享的内容对大家有帮助,更多相关知识,欢迎关注亿速云行业资讯频道!
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。