當頁面完全載入（包括圖像）時如何執行 JavaScript 函數？

頁面完全載入時執行JavaScript 函數

問題：

如何觸發JavaScript 函數只會執行頁面上的所有元素（包括圖像）載入完成後？

答案：

解決方案在於利用載入事件。與 DOMContentLoaded 事件（在解析 HTML 文件且 DOM 樹準備好時發生）不同，load 事件會等到所有資源（包括圖片）載入完畢。這使得它非常適合在整個頁面完全載入時執行程式碼。

實作：

要在頁面完全載入時執行函數，您可以使用以下程式碼：

<code class="js">window.addEventListener('load', function () {
  // Your code here will run when the page is fully loaded
});</code>

範例：

例如，如果您想在頁面完全加載時在警報框中顯示訊息，您可以使用以下程式碼：

<code class="js">window.addEventListener('load', function () {
  alert("It's loaded!");
});</code>

透過使用load 事件，您可以確保僅在所有頁面元素（包括圖像和其他資源）完成載入後才執行JavaScript 程式碼。這有助於防止由於在頁面完全加載之前過早執行程式碼而可能出現的問題。

以上是當頁面完全載入（包括圖像）時如何執行 JavaScript 函數？的詳細內容。更多資訊請關注PHP中文網其他相關文章！