js程式碼執行順序簡單介紹

antzone發表於2017-03-17
JS

大家知道javascript程式碼都是順序執行，對它要有充分的認識，否則可能會出現一些莫名其妙的問題，當然這些問問一般僅僅會出現在初學者身上，對於稍有經驗的程式設計師來說很難出現這樣的問題，下面就簡單介紹一下。

下面是我們要操作的div元素:

[HTML] 純文字檢視 複製程式碼
<div id="thediv">螞蟻部落</div>

如果將js程式碼放置於上面靜態程式碼的前面，例如:

[JavaScript] 純文字檢視 複製程式碼
var odiv=document.getElementById("thediv");

以上程式碼程式碼並不能顧獲取div物件，因為在執行js程式碼的時候，並沒有載入到div元素。

解決上面的問題可以使用以下方法:

第一種方法:

將js程式碼放置於div後面，遮掩在執行js程式碼的時候，保證div已經載入完成。

第二種方法:

使用window.onload事件，也就是等頁面文件內容完全載入完畢再去執行事件處理函式中的程式碼，例如:

[HTML] 純文字檢視 複製程式碼
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.softwhy.com/" />
<title>螞蟻部落</title>
<script type="text/javascript"> 
window.onload=function()
{
  var odiv=document.getElementById("thediv");
}
</script> 
</head> 
<body> 
<div id="thediv">螞蟻部落</div>
</body> 
</html>

相關文章