Jquery 是一款非常強(qiáng)大的 JavaScript 庫，可用于簡化 JavaScript 編程，提高程序代碼的運(yùn)行效率。其中，jquery 的 load 函數(shù)尤為強(qiáng)大，可以用于異步加載 HTML 網(wǎng)頁代碼，從而縮短網(wǎng)站的加載時(shí)間，提升用戶體驗(yàn)。但是，在加載網(wǎng)頁時(shí)，我們可能需要加入一個(gè)等待效果，以提示用戶頁面正在加載，這時(shí) load 函數(shù)就能夠派上用場了。

代碼示例：

$(document).ready(function() {
$("button").click(function() {
$("#content").html("
");
$("#content").load("page.html");     
});
});

在這個(gè)例子中，當(dāng)用戶單擊頁面上的按鈕時(shí)，我們將在 id 為 content 的元素內(nèi)插入一個(gè) loader 加載圖標(biāo)。接著，我們使用 load 函數(shù)從 page.html 文件中加載 HTML 代碼，完成后將其插入到 content 元素中。

現(xiàn)在，我們需要為 loader 加載圖標(biāo)添加額外的樣式。假設(shè)我們需要使用 Font Awesome 中的旋轉(zhuǎn)效果。可以這樣做：

.loader {
position: absolute;
left: 50%;
top: 50%;
margin: -16px 0 0 -16px;
font-size: 32px;
color: #333;
}
.loader:before {
content: "\f110";
font-family: FontAwesome;
display: inline-block;
-webkit-animation: fa-spin 2s infinite linear;
animation: fa-spin 2s infinite linear;
}
@-webkit-keyframes fa-spin {
0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
}
@keyframes fa-spin {
0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
}

經(jīng)過這些改進(jìn)后，用戶在加載網(wǎng)頁時(shí)，將看到一個(gè)旋轉(zhuǎn)的 Font Awesome 圖標(biāo)，提示頁面正在加載。當(dāng)加載完成后，該圖標(biāo)將被替換為從 page.html 文件中加載的內(nèi)容。