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

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事件可以触发

 

 

（待续）