关于script异步是否可以使用DOMContentLoaded

Posted on 2018-11-06 16:10 jevons-lee 阅读(…) 评论(…) 编辑 收藏

DOMContentLoaded介绍

当初始的 HTML 文档被完全加载和解析完成之后，DOMContentLoaded 事件被触发，而无需等待样式表、图像和子框架的完成加载。另一个不同的事件 load 应该仅用于检测一个完全加载的页面。 在使用 DOMContentLoaded 更加合适的情况下使用 load 是一个令人难以置信的流行的错误，所以要谨慎。注意：DOMContentLoaded 事件必须等待其所属script之前的样式表加载解析完成才会触发。

 

DOMContentLoaded写法

<script>

  document.addEventListener(“DOMContentLoaded”, function(event) {

      console.log(“LOADED”);

  });

</script>

 

DOMContentLoaded兼容性

Chrome

Firefox (Gecko)

Internet Explorer

Opera

Safari

0.2

1.0 (1.7 or earlier)

9.0

9.0

3.1

 

 

script async

该布尔属性指示浏览器是否在允许的情况下异步执行该脚本。该属性对于内联脚本无作用 (即没有src属性的脚本）。

 

 

 

l  Google Chrome  没有问题

DOMContentLoaded事件的触发并不受async脚本加载的影响

 

l  火狐浏览器  不能加载出console.log

但是DOMContentLoaded事件可以触发

 

l  Edge  提示问题

DOMContentLoaded事件可以触发

 

 

（待续）

 

版权声明：本文为jevons-lee原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://www.cnblogs.com/jevons-lee/p/9915912.html