jQuery 選擇器循環(huán)可以幫助我們針對某個(gè)元素或一組元素進(jìn)行重復(fù)的選擇與操作,從而實(shí)現(xiàn)代碼的復(fù)用和優(yōu)化。下面是一些常見的 jQuery 選擇器循環(huán)方式:
// 選取所有 p 標(biāo)簽,并逐個(gè)輸出文本內(nèi)容 $("p").each(function() { console.log($(this).text()); }); // 選取某個(gè) class 為 item 的元素,并逐個(gè)添加樣式 $(".item").each(function() { $(this).addClass("active"); }); // 選取某個(gè) id 為 list 的元素下的所有 li 標(biāo)簽,并逐個(gè)執(zhí)行回調(diào)函數(shù) $("#list li").each(function(index) { console.log("第" + (index + 1) + "個(gè) li 標(biāo)簽:" + $(this).text()); }); // 選取某個(gè)元素并進(jìn)行多次操作 var $box = $(".box"); $box.each(function() { $(this).css("background-color", "red"); }); $box.text("Hello, jQuery!"); // 選取某個(gè)元素并進(jìn)行多個(gè)操作 $(".btn").click(function() { $(this).addClass("active").siblings().removeClass("active"); });
通過使用 jQuery 的選擇器循環(huán),我們可以更加高效地處理大量元素的操作,且代碼更加簡潔易懂。但同時(shí),為了避免性能問題,需要注意在實(shí)際運(yùn)用中選擇合適的選擇器和方法,并且盡量避免過多的嵌套選擇器循環(huán)。
下一篇html的留言板代碼