JavaScript是一種可以在瀏覽器中執行的編程語言，常被用于為網頁添加交互性和動態效果。在這些效果中，頁面加載時的操作尤其重要，因為它決定了頁面加載完成后用戶看到什么。在本文中，我們將討論一些常見的JavaScript技巧，使頁面加載時可以執行某些行為。
一、為元素添加“加載時”動畫 當我們訪問某些網站時，頁面加載速度慢，我們就會看到一個正在加載的動畫，它用來告訴用戶頁面正在加載中。我們可以利用JavaScript來實現這種效果。一個簡單的實現方法是用一個類名“loading”來描述該動畫，使用“動畫”類添加到元素中，如果頁面加載完成，就可以通過刪除該類來消除該效果。以下是一個簡單的代碼示例：

<div id="myElement">Something here</div>

.loading {
background: url("loading.gif") center center no-repeat;
}

二、加載完成后執行動作 當頁面加載完成后，我們有時需要執行一些特殊的操作。例如，我們可以在頁面底部添加一個“返回到頂部”的按鈕。當我們在頁面中向下滾動時，該按鈕不會出現，但當我們滾動到頁面底部時，它就會出現。然后，單擊返回到頂部按鈕時，頁面將平滑地滾到頂部。以下是代碼示例：

<button id="back-to-top">Back to Top</button>

三、預加載圖像和其他資源 當我們有大量圖像、音頻、視頻或其他大型資源時，我們可以使用預加載方法，先加載資源，然后在需要時再顯示它們。這將加快初始加載時間，因為當我們需要資源時，它們已經被緩存到我們的計算機中。以下是一個簡單的JavaScript函數，用于預加載圖像（請注意，我們需要在頁面加載完成后再執行此函數）：

function preloadImage(url) {
var img = new Image();
img.src = url;
}

因此，當我們需要顯示圖像時，它已被加載并顯示在頁面上：

<img src="loading.gif">
<script>
preloadImage("image.jpg");
</script>

這篇文章探討了一些常見的JavaScript技巧，用于執行頁面加載時的操作。這些技巧可以幫助我們在頁面加載完成后添加動畫、執行特定操作并加快網頁加載速度。掌握這些技能將使您的網頁更具交互性、可訪問性和創新性。