<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script src="test1.js" defer></script>
如果没有defer或async属性,浏览器会立即加载并执行相应的脚本。<br>
阻塞了后续文档的加载。<br>
一、defer属性<br>
defer的加载与html解析并行(异步),执行会被延迟到整个页面都解析完毕之后再执行。<br>
<script src="test1.js" async></script>
<br>
二、sync属性<br>
sync的加载和执行与html解析并行(异步),也就是说js加载完了之后会立即执行,不会等待html解析完。(谁先加载谁执行)<br>
<br>
三、让JS最后加载和执行(这种方法只会和html内容一起加载)<br>
把js外部引入的文件放到页面底部,来让js最后引入,从而加快页面加载速度<br>
<br>
四、sync和defer相同点<br>
加载时不会都阻塞html解析<br>
</body>
</html>
上一篇

2020-12-19
下一篇

2020-12-14