生活随笔
收集整理的這篇文章主要介紹了
JQuery中的基本筛选选择器
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
很多時候我們不能直接通過基本選擇器與層級選擇器找到我們想要的元素，為此jQuery提供了一系列的篩選選擇器用來更快捷的找到所需的DOM元素。篩選選擇器很多都不是CSS的規范，而是jQuery自己為了開發者的便利延展出來的選擇器
篩選選擇器的用法與CSS中的偽元素相似，選擇器用冒號“：”開頭。我們通過一個列表，來看看基本篩選器的描述
注意：
<!DOCTYPE html>
<html><head><meta http-equiv="Content-type" content="text/html; charset=utf-8" /><title></title><link rel="stylesheet" href="imooc.css" type="text/css"><script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script>
</head><body><h2>基本篩選器
</h2><h3>:first/:last/:even/:odd
</h3><div class="left"><div class="div"><p>div:first
</p><p>:even
</p></div><div class="div"><p>:odd
</p></div><div class="div"><p>:even
</p></div><div class="div"><p>:odd
</p></div><div class="div"><p>:even
</p></div><div class="div"><p>div:last
</p><p>:odd
</p></div></div><script type="text/javascript">找到第一個div$(".div:first").css("color", "#CD00CD");</script><script type="text/javascript">$(".div:last").css("color", "#CD00CD");</script><script type="text/javascript">$(".div:even").css("border", "3px groove red");</script><script type="text/javascript">$(".div:odd").css("border", "3px groove blue");</script><h3>:eq/:gt/:lt
</h3><div class="left"><div class="aaron"><p>:lt(3)
</p></div><div class="aaron"><p>:lt(3)
</p></div><div class="aaron"><p>:eq(2)
</p></div><div class="aaron"></div><div class="aaron"><p>:gt(3)
</p></div><div class="aaron"><p>:gt(3)
</p></div></div><script type="text/javascript">$(".aaron:eq(2)").css("border", "3px groove blue");</script><script type="text/javascript">$(".aaron:gt(3)").css("border", "3px groove blue");</script><script type="text/javascript">$(".aaron:lt(2)").css("color", "#CD00CD");</script><h3>:not
</h3><div class="left"><div><input type="checkbox" name="a" /><p>Aaron
</p></div><div><input type="checkbox" name="b" /><p>慕課
</p></div><div><input type="checkbox" name="c" checked="checked" /><p>其他
</p></div></div><script type="text/javascript">$("input:not(:checked)+p").css("background-color", "#CD00CD");</script>
</body></html>
執行結果如下：
創作挑戰賽新人創作獎勵來咯，堅持創作打卡瓜分現金大獎
總結
以上是生活随笔為你收集整理的JQuery中的基本筛选选择器的全部內容，希望文章能夠幫你解決所遇到的問題。
如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。
