我也不問什么阻塞之類的東西，我就問下面這兩段很簡單的代碼相同的只是放的位置不一樣，為什么會alert("aaaaaaaaaaaa");都彈出，而按鈕的事件放在body里的代碼響應，而放在head里的代碼就不響應
<html>
<head>
<script type="text/javascript" charset="utf-8" src="js/jquery-1.8.3.js"></script>
<script type="text/javascript">
alert("aaaaaaaaaaaaaaaaaa");
$("#btn").click(function(){
alert("abcde");
});
</script>
</head>
<body>
<input type="button" id="btn" value="test"/>
</body>
</html>
<html>
<head>
<script type="text/javascript" charset="utf-8" src="js/jquery-1.8.3.js"></script>
</head>
<body>
<input type="button" id="btn" value="test"/>
<script type="text/javascript">
alert("aaaaaaaaaaaaaaaaaa");
$("#btn").click(function(){
alert("abcde");
});
</script>
</body>
</html>
放在body和head其實差不多的，只不過是文檔解析的時間不同。瀏覽器解析html是從上到下的。
如果把javascript放在head里的話，則先被解析,但這時候body還沒有解析，所以$(#btn)會返回空值。如果把javascript放在head里的話，一般都會綁定一個監聽，當全部的html文檔解析完之后，再執行代碼：
$(document).ready(function(){
//這里放入執行代碼
})
一般情況下最好是單獨把javascript放在js文件里，通過head里的<script src="file.js"></script>鏈接起來，css則是通過<link>。這樣做的目的是為了讓內容-樣式-邏輯分離，以便以后能夠更好地維護。
哈哈 雖然我是后台，但是遇到這種簡單的前端問題我也來回答一下吧。因為放在head里面的script在執行的時候，下面dom還沒有加載完成。所以找不到#btn..
所以一般不都是 $(document).ready(function(){...});