在完成頁面加載後開始預加載內容

我正在嘗試使預加載工作的方式使得希望預加載的組件在成功加載頁面後開始加載。在完成頁面加載後開始預加載內容

例如，我有index.php。我希望它完全加載。只要它加載，我想開始加載其他組件。

要說清楚。我有一個使用大尺寸圖像的導航。如果我將它們與index.php文件一起加載，它會增加頁面的加載時間。我希望在完成渲染index.php之後加載這些大圖像？

我說得通嗎？可能嗎？

來源

2010-04-11 amit

只需將預加載函數附加到窗口對象的「加載」事件即可。在頁面（和所有外部資源）完全加載後加載。

這與JQuery提供的各種庫（如Ivo的答案）所提供的「DOMReady」事件不同。 $(document).ready(fn)將在DOM準備就緒（意味着完整的http文檔已被接收/解析）但不等待外部資源（圖像，css等）下載時觸發。

相反，你要$(window).load()：

<script type="text/javascript"> 
preLoadStuff = function(){ 
    //code that does preloading goes here 
} 

$(window).load(preLoadStuff); 
</script>

這將所有圖像後觸發preLoadStuff處理程序等，完全加載。

來源

2010-04-11 18:51:32 timdev

$(document).ready(function() { YOUR CODE HERE });

http://api.jquery.com/ready/

來源

2010-04-11 18:05:21

不完全 - 此解決方案將在DOM準備就緒時觸發代碼，但不會等待外部資源加載。在這種情況下，他似乎希望等到其標記中引用的所有內容完全加載後，然後執行代碼以預加載其他圖像。 – timdev 2010-04-11 18:55:48

當DOM準備就緒時，所有標記都會被完全加載，這意味着頁面已準備好在瀏覽器中可視化。他可以添加自定義的功能，將加載他的JavaScript（除jQuery以外）和圖像，並觸發$（document）.ready（） – 2010-04-11 19:50:33

的圖像被加載在幾乎平行於PHP程序的執行。這實際上取決於執行PHP程序所需的時間，您輸出到瀏覽器的數據的速度傳輸等。
您不應該在處理index.php後嘗試加載這些圖像，那不會幫助，因爲你的服務器是處理PHP腳本的人，而瀏覽器是應該獲取圖像的人。

讓您的PHP程序儘快輸出圖像標籤是很好的，並改善用戶體驗。

來源

2010-04-11 18:09:01 Dor

我不認爲你瞭解網頁的工作原理。在任何HTML輸出甚至開始處理之前，index.php文件將執行它所需的一切，這隻需要幾毫秒。然後，HTML將開始按照頁面上顯示的順序加載所有內容。在顯示任何內容之前，頁面不會等待圖像完成加載。它會顯示頁面輪廓，因爲它已經加載到目前爲止，並且圖像加載完成後，只需將它們插入到正確的位置。這聽起來像你想要的東西已經是事情的方式。

來源

2010-04-11 18:09:33 animuson

在完成頁面加載後開始預加載內容

回答

相關問題