放在头部(head):
- 影响:导致页面加载延迟,可能出现白屏情况。
- 原因:当文件放在头部时,浏览器在加载网页时会先将所有的JavaScript代码下载下来,然后再从<body>的起始标签开始渲染页面,当JavaScript文件稍大时,就会导致页面明显白屏,此时浏览器窗口完全空白。
- 解决办法:
- 将JavaScript文件标签放在body中
<body> <script src="demo1.js"></script> <script src="demo2.js"></script> </body>
- 推迟执行脚本(defer)
<head> <script defer src="demo1.js"></script> <script defer src="demo2.js"></script> </head>
-
异步执行脚本(async)
<head> <script async src="demo1.js"></script> <script async src="demo2.js"></script> </head>
注意: