2015-10-07 17 views
0

我是新來的JS,我不知道什麼時候完成的功能執行。onload與腳本在body結尾的區別?

實例A:

<html> 
    <head> 
    <title>A</title> 
    <script src="myScript.js"></script> 
    </head> 
    <body onload="myFunction()"> 
    [Content here...] 
    </body> 
</html> 

例B:

<html> 
    <head> 
    <title>B</title> 
    <script src="myScript.js"></script> 
    </head> 
    <body> 
    [Content here...] 
    <script> 
     myFunction(); 
    </script> 
    </body> 
</html> 

從我到目前爲止當解析器達到其執行功能來讀取。這不會讓例子A和B一樣嗎?當在B中調用myFunction()時,屏幕上是否顯示頁面的所有內容(例如帶文本的表格)?

+0

onload事件將觸發一次整個網頁,包括圖像,音頻/視頻被加載,而身體標記結束之前,就像DOMContentLoaded事件.. – Rayon

回答

2

在主體末端添加<script>本質上會在處理完<script>之前的項目之後運行它(您可以將其視爲在完成body的DOM時運行)。儘管onload不僅等待DOM,而且還爲所有內容完成加載,如圖像。

+0

如果我有一個表的文本內容很多,需要一些時間來加載/渲染,所有它會在腳本執行前可見嗎? – John

0

onLoad將等待直到整個文檔已完成加載圖像等。在關閉body標籤之前放置腳本的好處是,用戶可以更快地看到頁面呈現,如果您的頭腦中有大量腳本需要花費幾秒鐘才能下載,用戶會看到一個空白頁面,直到它加載腳本並繼續下載文檔的其餘部分。我會用這兩個,onLoad以確保在底部的腳本時,一切都已經加載的腳本被執行,從而使用戶擁有的感覺是,頁面加載速度快:)