【JavaScript】出現即使設定了ID也獲取不到的可能原因與window.onload
有時候，在JavaScript中，即使設定了ID也有可能出現document.getElementById()獲取不到的情況，然後你就開始想document是否寫錯之類的，其實根本就不是你的程式碼的大小寫出現了問題，主要是你還沒有搞清楚直接寫在<script></script>之間東西與寫在window.onload=function(){}裡面的東西的區別到底在哪裡。
比如如下的非常一段簡單程式碼，在網頁中除了一個ID為a，然後裡面寫了aaaa的圖層div之外就再也沒有其它東西了，在頭部有一段寫得“非常規範”的指令碼，本來就<script></script>就可以了，與<script type="text/javascript" language="javascript"></script>根本就沒有區別的，免得有些人自以為很規範的紀律流，說是因為這個原因而導致下面的一系列的問題。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>onloadtest</title> <script type="text/javascript" language="javascript"> alert(document.getElementById("a")); window.onload=function(){ alert(document.getElementById("a").innerHTML); } </script> </head> <body> <div id="a">aaaa</div> </body> </html> <script> alert(document.getElementById("a").innerHTML); </script>
這段指令碼首先要獲取一個圖層，然後再通過window.onload之後獲得一個a圖層的內容，估計很多人以為第一行程式碼
alert(document.getElementById("a"));
咦？怎麼第一個alert會彈出空啊？這是因為HTML在載入的時候，是一行一行地編譯，動態編譯的，它不是像C語言那樣，一次性地編譯整個程式，再給你執行的。也就是所謂的動態編譯域與靜態編譯域的區別。因此，可以解釋為什麼Javascript讀到錯誤會自動停止執行，也會出現此前我已經提到過的《【JavaScript】變數衝突是可以通過編譯的》（
回到正題上面來，開始，網頁讀到第一個alert指令碼的時候，網頁中根本就沒有出現id為a的圖層div！所以不能獲取是很正常的。
解決方式有兩個，一個是使用window.onload=function(){}，要求這段指令碼必須在所有的網頁東西讀完才能執行，二是，直接把這段指令碼放在最下面</html>之後，這樣就可以直接放在<script></script>之中了，指令碼指令碼，處於腳部的網頁執行劇本，望文生義都知道要放在網頁的腳部了。這也是我很不爽一些人老是愛在<head></head>寫指令碼的原因。
當然，通過這個例子，你也要清楚，如果在頭部引入javascript，類似<script src="js/jquery-1.11.1.js"></script>之類的，注意，如果引入的Javascript中出現要網頁一開始就載入的javascript的話，必須把寫著指令碼寫入window.onload=function(){}