同步加载
- 阻塞模式,提高安全性
过多JS加载会影响页面效率
默认情况下,JS是同步加载,及优先加载外部JS,只有当JS文件加载完成,don和css才开始加载
<script src = 'index.js' ></script>
异步加载
- 非阻塞加载
- 动态创建script
- defer 延迟加载JS,等到HTML的DOM完全解析之后
- async HTML的文档解析和脚本的获取同时进行
<script src = 'index.js' defer></script> -defer
<script src = 'index.js' async></script> -async
理解优化
- 浏览器解析html的DOM是从上到下的,JS默认为同步加载
- 先被解析head的JS资源, 在body没有解析完之前会被绑定监听
标签:body,defer,页面,JS,解析,加载 From: https://www.cnblogs.com/nagisb/p/18412822即:head的JS资源在页面加载前,body的JS资源在页面加载后逐一获取JS
如:JS替换页面全局变量时, 需要将JS在body获取, 或者在head进行defer
PS:网页播放器一般放在body最底部,网页播放器与内容相干甚少,直接按需求defer/async