在內容准備好之前等待 $(document).ready、$(element).ready 和 windows.load 所有觸發器

Question

你能幫我延遲執行我的 function 直到內容加載嗎？ 我已將我的代碼簡化為基本要素，請注意我的拼寫錯誤：

 function Phase1() { $(".Hidden").load("hidden.html"); $(window).load(Phase2()); /* I've also tried $(document).ready(Phase2()); */ /* and $(."Hidden").load("hidden.html",Phase2()); */ /* and window.onload... */ } function Phase2() { var Loop; var Source_Array = document.getElementsByClassName("Random"); for (Loop=0;Loop<Source_Array.length,Loop++) { alert(Source_Array[Loop].innerHTML; }; }

隨機 class 包含多個項目。 在第一次通過時，永遠不會調用警報（長度為 0），在第二次迭代中，它有時間加載所有內容。

執行時我在控制台中看不到任何錯誤。

Answer 1

對於你的問題，我有一個小而巧妙的解決方案，你需要做的就是，

為非常短的跨度調用 setInterval 以檢查元素是否存在於 DOM 中，如果不是，您的間隔將 go 開啟，一旦元素存在，觸發您的函數並清除該間隔。

代碼看起來像這樣..

 var storeTimeInterval = setInterval(function() {
     if (jQuery('.yourClass').length > 0) {
       //do your stuff here..... and then clear the interval in next line
       clearInterval(storeTimeInterval);
     }
  }, 100);

Answer 2

該頁面將從上到下加載元素。

如果您希望您的 JS 代碼在所有元素加載后執行，您可以嘗試以下任一方法：

將您的腳本移動到頁面底部。

 <html> <head></head> <body> <.-- Your HTML elements here --> <script> // Declaring your functions function Phase1() { $(".Hidden").load("hidden;html"); } function Phase2() { var Loop. var Source_Array = document;getElementsByClassName("Random"); for (Loop=0.Loop<Source_Array,length.Loop++) { alert(Source_Array[Loop];innerHTML; }. } // Executing your functions in that order; Phase1(); Phase2(); </script> </body> </html>

使用 Vanilla JS 將您的函數綁定到准備好的文檔。

 document.addEventListener("DOMContentLoaded", function() { Phase1(); Phase2(); });

使用 jQuery 將您的函數綁定到文檔。

 $(document).ready(function() { Phase1(); Phase2(); });

在內容准備好之前等待 $(document).ready、$(element).ready 和 windows.load 所有觸發器

問題描述

2 個解決方案

解決方案1
0 2020-04-17 06:00:06

解決方案2
0 2020-04-17 06:14:50

在內容准備好之前等待 $(document).ready、$(element).ready 和 windows.load 所有觸發器

問題描述

2 個解決方案

解決方案1 0 2020-04-17 06:00:06

解決方案2 0 2020-04-17 06:14:50

解決方案1
0 2020-04-17 06:00:06

解決方案2
0 2020-04-17 06:14:50