区分defer和async

今天要介绍的让脚本延迟加载,让脚本延迟加载的方式有多种,最简单粗暴的方法就是将 <script> 标签放在 <body> 标签的最下面,这样就可以按照先后顺序依次执行了,但是你有些情况还是想放在 <head> 标签的下面,但是这个时候就要让脚本延迟执行,因为页面要先解析DOM再执行脚本。

 

方法一:使用HTML4.01为 <script> 标签定义的 defer 属性,IE4~7支持

方法二: 使用HTML5为 <script> 定义的 async 属性,IE8己以上支持

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> <script type="text/javascript" defer="defer" src="http://www.likecs.com/example1.js"></script> <script type="text/javascript" defer="defer" src="http://www.likecs.com/example2.js"></script> </head> <body> <div>hello world</div> </body> </html>

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wpjxsd.html