jQuery（縮寫(xiě)為 “$” 符號(hào)）是一種流行的 JavaScript 庫(kù)，它的靈活性和易于使用的特性使得它成為開(kāi)發(fā)者們的首選。其中一個(gè)常用的特性就是操作網(wǎng)頁(yè)元素的顏色。下面讓我們結(jié)合代碼學(xué)習(xí)如何在 li 元素中改變字體顏色。

//HTML 代碼
<ul id="colorList">
<li>紅色</li>
<li>綠色</li>
<li>藍(lán)色</li>
</ul>
//JavaScript 代碼
$(document).ready(function(){
$("#colorList li").click(function(){
var color = $(this).text(); // 獲取 li 元素的文本
$("p").css("color", color); // 改變文字顏色
});
});

上述代碼會(huì)給 id 為 “colorList” 的 ul 元素的所有 li 子元素添加了一個(gè)點(diǎn)擊事件。當(dāng)某個(gè) li 元素被點(diǎn)擊時(shí)，它的文本將被提取出來(lái)，作為新的文字顏色。

最后一行代碼中的 css() 函數(shù)用于改變頁(yè)面元素的樣式。第一個(gè)參數(shù) “color” 指定了要改變的樣式屬性為文字顏色，第二個(gè)參數(shù)是顏色值，可以是單詞、十六進(jìn)制碼，也可以是 rgba() 函數(shù)。

至此，我們已經(jīng)用簡(jiǎn)單的 jQuery 代碼實(shí)現(xiàn)了 li 文本顏色的更改。通過(guò)這個(gè)例子，您可以學(xué)習(xí)到 jQuery 的事件處理、選擇器和樣式操作技巧。有興趣的讀者也可以結(jié)合實(shí)際需求學(xué)習(xí)更多的 DOM 操作技能。