主è¦æ¯å å è½½ååå è½½çåºå«ã
å¦æJavaScriptèæ¬åå¨headæ ç¾éé¢ï¼é£ä¹éè¦ç¨window.onloadèµ·å°ä¸ä¸ªå»¶è¿å è½½çä½ç¨ã
å¦æJavaScriptèæ¬åå¨bodyéé¢ï¼ä¹è¦çå ·ä½ä½ç½®ãå¦æåå¨bodyéé¢ï¼ä¸è¬é½æ¯åå¨äºbodyæ ç¾çæåé¢ã
ä¾åï¼åå¨bodyéï¼<body><input type="button" id="btn"/>
<a href="javascript:;" id="div-box"></a>
<script>
var oBtn = document.getElementById('btn');
var oBox = document.getElementById('div-box');
oBtn.onclick = function () {
var html = '<div style="width:100px; height:100px; background: #ccc;"></div>';
if (oBox.innerHTML == '') {
oBox.innerHTML = html;
} else {
oBox.innerHTML = '';
}
};
</script>
</body>ä¾åï¼åå¨headéï¼<head lang="en">
<meta charset="UTF-8">
<title></title>
<script>
window.onload = function (){
var oBtn = document.getElementById('btn');
var oBox = document.getElementById('div-box');
oBtn.onclick = function () {
var html = '<div style="width:100px; height:100px; background: #ccc;"></div>';
if (oBox.innerHTML == '') {
oBox.innerHTML = html;
} else {
oBox.innerHTML = '';
}
};
}
</script>
</head>
<body>
<input type="button" id="btn"/>
<a href="javascript:;" id="div-box"></a>
</body>
先加载和后加载的区别。
JavaScript脚本写在head标签里面，那么需要用window.onload起到一个延迟加载的作用。
JavaScript脚本写在body里面，也要看具体位置。如果写在body里面，一般都是写在了body标签的最后面。
javascript代码默认是同步执行的，不管是内嵌的还是外部的javascript代码，都会阻塞后续html代码的加载和渲染以及后续javascript的解析。这是个必要的特性，试想一下，如果你要使用某个功能，例如jquery 库的功能，把jquery 库放在你是用的代码之前（一般放在head里），这样你在其后的任何位置都可以无限制的使用jquery 的功能而不用担心其jquery 函数功能是否已经被解析载入。
但如果你这有一个javascript文件比较大，而这一部分的功能比较独立，没有他也不会影响页面的显示效果，那就可以考虑把它放在body的最后，即</body>之前，这样整个页面载入了，页面完全显示了才开始处理这部分javascript，当然，也可以loadjs 等异步加载方式进行异步加载，这样就不会阻塞其他html和javasscript了。
