標籤：style blog color io 使用 ar java for sp
JS程式包含架構部分，和應用部分。
架構部分提供代碼的組織作用，包括定義全域變數，定義命名空間方法等，和具體應用無關，每個頁面都需要包含相同的架構，架構部分在每個頁面都相同。
應用部分提供頁面的邏輯功能。
1.要將應用部分的程式碼群組織起來，給他們一個統一的入口。例如：將應用部分的代碼放到函數init中
function init() { ...... }
2.需要在適當的時候調用這個入口函數，完成頁面程式的初始化。
如果JS程式控制控制某個DOM節點，而改節點當時還沒載入，程式就會報錯。
因此，我們可以監聽程式的onload事件，當程式觸發onload事件後呼叫指令碼。
<script type="text/javascript"> window.onload=function() { alert(document.getElementById("test").innerHTML); } //window.lonload = init; </script>
<div id="test">hello world</div>
還存在一個問題，window的onload時間要求網頁內所有元素全部載入完畢後才會觸發，如果網頁裡有很大的圖片，載入時間就會邊長，初始化函數就會延時很久才被執行。
為瞭解決這個問題，很多JS架構提供了DOMReady事件代替window.onload.DOMReady只判斷DOM節點是否已經全部產生，至於節點內容是否載入完畢並不關心。
JQ的DOMReady
<script> alert(document.getElementById("test").innerHTML); $(document).ready(init);</script><div id="test">hello world</div>
如果不使用JS架構，我們有一種簡單的方法實現和DOMReady相似的功能
<script type="text/javascript"> function init() { alert(document.getElementById("test").innerHtml); }</script><body><div id="test">hello world</div>...<script type="text/javascript"> init();</script></body>
我們定義init函數，但並不急著立即調用它，我們可以在頁面的最後，即</body>標籤之前再調用init函數，此時頁面內的DOM節點不一定都“載入完成了”，但一定都產生了，從而類比DOMReady效果。
JS的架構部分代碼清單如下
<script type="text/javascript"> var GLOBAL={}; GLOBAL.namespace=function(str) { var arr=str.split("."),o=GLOBAL; for (i=(arr[0]=="GLOBAL") ? 1 : 0; i<arr.length; i++) { o[arr[i]] = o[arr[i]] || {}; o = o[arr[i]]; } }</script><script type="text/javascript"> function init() { //應用部分代碼 }</script>...<script type="text/javascript"> init();</script>
給JS程式一個統一的入口
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
