1,就速度而言:
将<script>放头部,会先下载js文件再执行html,给用户感觉卡;
将<script>放最后,对于高度依赖js的html,会显得慢。
async和defer属性让浏览器一边下载js,一边解析html。
带async属性的script会异步执行,只要下载完就执行,这会导致script2.js可能先于script1.js执行。
defer就能保证script有序执行,script1.js先执行,script2.js后执行
2,就执行函数任务而言:
如果函数中有用到html中的属性,值等,需要等待html被解析完再执行函数(因为浏览器是按顺序执行,解析代码的)。例如:
若在head头部调用函数aler();
function alert(){
var x1=document.getElementById("div1");
alert(x1.value);
}
aler(); //浏览器毫无反应
html:
<div id="div1">HELLO</div>
若在被使用了属性的标签之后调用函数:
function aler(){
........}
html:
<div id="div1">HELLO</div>
<script>
aler(); //HELLO;
</script>