在写代码时,如果让JavaScript加载在JS要操作的html元素之前,代码就会报错.
在被操作的html前面调用JavaScript是有隐患的.
内联时可以使用以下:
document.addEventListener("DOMContentLoaded",function(){
........
})
这是事件监听器,当HTML文档加载完毕之后将触发调用function里面的代码,进而避免了错误
外联时:
async和defer
使用async时脚本继续下载的同时不影响页面渲染,脚本不会阻止剩余页面的显示,但是这时脚本的运行顺便就是随机的.当页面彼此完全独立,脚本互不依赖的情况下async是最好的选择.
<script async src="......"></script>
如果你的脚本互相依赖,一个脚本要在另一个脚本执行完后才能使用,那么defer是最好的选择.脚本会按照写代码的顺序依次加载运行
<script defer src="......."></script>