JavaScript：JavaScript何時評估函數，onload或何時調用函數？

JavaScript何時評估函數？是在頁面加載還是函數被調用？JavaScript：JavaScript何時評估函數，onload或何時調用函數？

我之所以這麼問是因爲我有以下代碼：

function scriptLoaded() { 
    // one of our scripts finished loading, detect which scripts are available: 
    var jQuery = window.jQuery; 
    var maps = window.google && google.maps; 

    if (maps && !requiresGmaps.called) { 
    requiresGmaps.called = true; 
    requiresGmaps(); 
    } 
    if (jQuery && !requiresJQuery.called) { 
    requiresJQuery.called = true; 
    requiresJQuery(); 
    } 
    if (maps && jQuery && !requiresBothJQueryGmaps.called) { 
    requiresBothJQueryGmaps.called = true; 
    requiresBothJQueryGmaps(); 
    } 
} 
// asynch download of script 
function addScript(url) { 
    var script = document.createElement('script'); 
    script.src = url; 
    // older IE... 
    script.onreadystatechange=function() { 
     if (this.readyState == 'complete') scriptLoaded.call(this); 
    } 
    script.onload=scriptLoaded; 

    document.getElementsByTagName('head')[0].appendChild(script); 
} 

addScript('http://google.com/gmaps.js'); 
addScript('http://jquery.com/jquery.js'); 

// define some function dependecies 
function requiresJQuery() { // create JQuery objects } 
function requiresGmaps() { // create Google Maps object, etc } 
function requiresBothJQueryGmaps() { ... }

我想要做的就是執行異步下載我的JavaScript，並在儘可能早的時間就開始執行這些腳本但是我的代碼依賴於腳本被明顯下載和加載的時間。

當我嘗試上面的代碼時，看起來我的瀏覽器仍然試圖在我的require*函數中計算代碼，甚至在這些函數被調用之前。它是否正確？還是我誤解我的代碼有什麼問題？

來源

2010-05-11 Benj

這個問題是唯一相關的是你是明智的把你的JavaScript從你的標記到外部文件。如果你缺乏這種智慧，那麼你應該期待不確定和混亂。 – 2010-05-11 16:30:54

調用函數進行評估。

例如

function test() { 
    window.foo = 'bar'; 
} 

console.log(window.foo); // => undefined 
test(); 
console.log(window.foo); // => bar

即使test是第一console.log之前創建的，window.foo不填充直到test實際上是調用。

如果您requires*功能懸掛/阻塞，那麼你需要顯示這些代碼（你爲什麼不爲有問題的人源？）

編輯：

目前，當您將加載的<script>附加到<head>時，您的網站正在關閉我。

無論如何，一個快速解決方法是在</body>之前將所需的腳本放在頁面底部附近，因爲只有在<head>中的腳本將在加載時完全阻止頁面。

有一些優雅的方式來晚負荷的資源，但是，爲了保持簡單..

<script type="text/javascript" src="http://path/to/jquery.js"></script> 
<script type="text/javascript"> 
requiresJQuery(); // jQuery is available at this point 
</script> 
</body>

的一點是，由於<script>放置後，您的主要元素，在DOM元素會在瀏覽器開始下載其他庫之前可用（並可能已加載）。

來源

2010-05-11 16:24:15 Matt

@Matt，我現在鏈接到原始文章中的活網站。查看更新。 – Benj 2010-05-11 16:32:04

@Matt，也 - 我基本上想方設法讓我的網站加載速度更快，我注意到一個大的JS是阻止。你可以在/看到我的活網站。我試圖做的與鏈接的HTML頁面是重做我的首頁，以刪除繼承JS阻塞執行較早的JS處理，如果可能的話（如果這是有道理的） – Benj 2010-05-11 16:36:08

@Benj看到我的更新 – Matt 2010-05-11 16:45:55

是的，你可能是誤解。即使你的函數包含一個語法錯誤，直到你實際調用這個函數也沒關係。

難道你是從別的地方調用這些函數嗎？也許你沒有提供準確的代碼示例？

來源

2010-05-11 16:26:44

我現在鏈接到原始帖子中的活網站。查看更新。 – Benj 2010-05-11 16:32:20

我沒有看到原始網站的鏈接。你已經把它刪除了嗎？ – 2010-05-11 17:13:54

JavaScript：JavaScript何時評估函數，onload或何時調用函數？

回答

相關問題