的Javascript功能遞延

我在JavaScript的被四處張望，試圖得到一些代碼來加載異步的Javascript功能遞延

我發現這個代碼示例

<script type="text/javascript"> 
function downloadJSAtOnload() { 
    var element = document.createElement("script"); 
    element.src = "defer.js"; 
    document.body.appendChild(element); 
} 
if (window.addEventListener) { 
    window.addEventListener("load", downloadJSAtOnload, false); 
} 
else if (window.attachEvent) { 
    window.attachEvent("onload", downloadJSAtOnload); 
} 
else { 
    window.onload = downloadJSAtOnload; 
} 
</script>

從http://www.feedthebot.com/pagespeed/defer-loading-javascript.html

的東西是它不我完全沒有做到我想要達到的目標。我希望能夠做類似的事情，但設置一個延期或某種類型的功能，這是所有加載後調用。那可能嗎？如果有的話，誰能幫忙解釋一下？

來源

2014-11-04 steffan

目前尚不清楚你試圖達到什麼目的。看起來你想動態加載一些JavaScript到你的頁面。我不確定這是否合法。你的邏輯意圖是什麼？ – Kolban 2014-11-04 02:04:06

這是參考谷歌pagespeed告訴你消除渲染阻止js之上的摺疊。 – steffan 2014-11-04 02:39:55

是的，這只是將你的JS移動到你的頁面底部。 [你應該檢查一下，有關於這個問題的一堆很好的資源。]（http://browserdiet.com/en/） – 2014-11-04 22:50:55

您可以嘗試使用正在加載的script標記的onload事件。看到這個問題，例如：Trying to fire the onload event on script tag。但是，這種機制看起來很粗略，可能不是跨瀏覽器。

另一種可能的方法是讓正在加載的腳本觸發一個事件，該事件可以由頁面上現有的javascript處理。這對您的特定情況可能有意義，也可能沒有意義，並且需要您控制加載的腳本。

最後，現在很少有JavaScript加載成爲您網站的性能瓶頸。那麼你爲什麼試圖動態加載JavaScript？您是否可以通過加載其他資源來解決相同的問題，例如通過做一個AJAX請求？

來源

2014-11-04 02:26:54 arghbleargh

這是參考谷歌pagespeed告訴你消除渲染阻止js之上。我已將CSS和js分成兩類，需要頁面呈現且不需要。也許我可以在頁面完全加載完成後，通過ajax來加載不需要的東西。感謝提示我會去檢查Ajax。 – steffan 2014-11-04 02:41:49

你已經標記jQuery在你的問題上。它有$.getScript()這完全是你在純粹的跨瀏覽器方式要求。這將異步加載腳本，然後調用當腳本完成加載和初始化指定的回調：

$.getScript("defer.js", function() { 
    // script loaded here 
    // you can run code here that uses that script 
});

如果你真的要等到DOM加載此腳本（通常沒有必要）之前加載，你直到所有其他資源被加載，包括圖片

$(document).ready(function() { 
    $.getScript("defer.js", function() { 
     // script loaded here 
     // you can run code here that uses that script 
    }); 
});

或者等待：

$(window).load(function() { 
    $.getScript("defer.js", function() { 
     // script loaded here 
     // you can run code here that uses that script 
    }); 
});

可以這樣做

如果您對加載腳本時的某些參考（特別是defer和async屬性感興趣，您可以閱讀this detailed post。

來源

2014-11-04 22:47:18 jfriend00

的Javascript功能遞延

回答

相關問題