script标签里的defer属性

Posted 2020-08-08 熊大大大大大大大大

入职新公司，看代码的时候注意到有的script标签中有一个defer属性，查了一下。在这里分享出来。

需要注意的有三点，其中前两点是在错误中分辨出来的：

错误来源：http://www.w3school.com.cn/tags/att_script_defer.asp

1，defer属性只有IE支持；应该说是在主流浏览器都是支持的；

http://www.runoob.com/tags/att-script-defer.html 中说了，在所有主流浏览器都支持defer属性；在Chrome，FF上亲测可用。

2，defer必须用在引入js文件的script标签中；内嵌在html页面中的script标签是不起作用的。

如下图所示，这样的用法是错误的， 直接报错误： Uncaught TypeError: Cannot read property \'firstChild\' of null

3，需要明白defer属性的真正含义，我参考的是http://www.cnblogs.com/neusc/archive/2016/08/12/5764162.html

　　精髓的话，就是js文件与dom结构一起加载，但是js文件会等html渲染完之后再执行。

最后再说一下，之所以用defer属性，是要把js文件在页头那里就引入，但是你要是放在了页尾，那就不用再使用这个属性。否则就是画蛇添足了。

 

 

PS：w3school是不是已经停更了啊？以后还是去菜鸟教程看吧。。。