源码网商城,靠谱的源码在线交易网站 我的订单 购物车 帮助

源码网商城

script的async属性以非阻塞的模式加载脚本

  • 时间:2022-04-21 23:12 编辑: 来源: 阅读:
  • 扫一扫,手机访问
摘要:script的async属性以非阻塞的模式加载脚本
[b]1.HTML5实现了script的async属性[/b],这个新的属性可以让js在浏览器中以非阻塞的模式加载,另外script还有一个defer属性,这个属性目前所有浏览器都已实现(除了firefox和chrome的早期版本),IE这方面做得好,从一开始就支持些属性。
[u]复制代码[/u] 代码如下:
//async <script async src="dquery.js" async></script> //defer <script async src="dquery.js" defer> </script>
[b]2.async和defer的区别[/b]: 带有async或者defer的script都会立刻下载并不阻塞页面解析,而且都提供一个可选的onload事件处理, 在script下载完成后调用,用于做一些和此script相关的初始化工作。它的不同之处在于async一旦下载完成就立即执行(在window.onload事件之前),不确保执行的顺序,而defer能确保js是在按照其在页面中的顺序执行(在DOMContentLoaded事件之前)。 [b]3.为了解决浏览器兼容问题可以使用下面的代码进行处理[/b]
[u]复制代码[/u] 代码如下:
function lazyload() { var elem = document.createElement("script"); elem.type = "text/javascript"; elem.async = true; elem.src = "js/dquery.js?v=11"; //对应的JS文件 document.body.appendChild(elem); } if (window.addEventListener) { window.addEventListener("load", lazyload, false); } else if (window.attachEvent) { window.attachEvent("onload", lazyload); } else { window.onload = lazyload;}
由于是异步加载所以使用相应js内容就需要在window.onload事件中使用,直接写在页面中会报脚本错误,如: [img]http://files.jb51.net/file_images/article/201301/2013115144259157.png?2013015144336[/img]
  • 全部评论(0)
联系客服
客服电话:
400-000-3129
微信版

扫一扫进微信版
返回顶部