一般直接引入第三方的js,如果第三方速度比较慢,会阻塞页面的渲染,用户等待的时候,会看到一片的空白,这样的用户体验不太好。因此一些不用马上运行的js,可以用异步进行加载。
加载方法有两种,如下
script 中加入 async=”async”
async 是html5的新属性,低版本的浏览器不兼容
<script type="text/javascript" async="async" src="http://thirdpart/js.js" ></script>
用js方法异步加载
这种方法是监听页面加载完之后,在页面中加入script,从而达到引入js文件
(function() { function asyncLoad() { var src = "http://thirdpart/js.js"; var urls = src.split(","); var x = document.getElementsByTagName('body'); if(x && x[0]){ for (var i = 0; i < urls.length; i++) { var s = document.createElement('script'); s.type = 'text/javascript'; s.async = true; s.src = urls[i]; x[0].appendChild(s); } } } window.attachEvent ? window.attachEvent('onload', asyncLoad) : window.addEventListener('load', asyncLoad, false); })();
Atas ialah kandungan terperinci html页面中异步加载js文件方法. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!