:first和:last過濾選擇器
:first得到一組相同標籤元素中的第1個元素
:last得到一組相同標籤元素中的最後1個元素
例如：
<body>
<div>改變最後一行"蘋果"背景顏色：</div>
<ol>
<li>葡萄</li>
<li>香蕉</li>
<li>橘子</li>
<li>西瓜</li>
<li>蘋果</li>
</ol>
<script type="text/javascript">
$("li:last").css("background-color", "red");
</script>:contains(text)過濾選擇器
:contains(text)選擇包含指定字符串的全部元素，它通常與其他元素結合使用，獲取包含“text”字符串內容的全部元素對象
例如：
<body>
<div>改變包含"jQuery"字符內容的背景色：</div>
<ol>
<li>強大的"jQuery"</li>
<li>"javascript"也很實用</li>
<li>"jQuery"前端必學</li>
<li>"java"是一種開發語言</li>
<li>前端利器——"jQuery"</li>
</ol>
<script type="text/javascript">
$("li:contains('jQuery')").css("background", "green");
</script>
</body>:has(selector)過濾選擇器
:has(selector)過濾選擇器的功能是獲取選擇器中包含指定元素名稱的全部元素
例如：
<body>
<div>改變包含"label"元素的背景色：</div>
<ol>
<li><p>我是P先生</p></li>
<li><label>L妹紙就是我</label></li>
<li><p>我也是P先生</p></li>
<li><label>我也是L妹紙哦</label></li>
<li><p>P先生就是我哦</p></li>
</ol>
<script type="text/javascript">
$("li:has('label')").css("background-color", "blue");
</script>
</body>:hidden過濾選擇器
:hidden過濾選擇器的功能是獲取全部不可見的元素，這些不可見的元素中包括type屬性值爲hidden的元素
例如：
<body>
<h3>顯示隱藏元素的內容</h3>
<input id="hidstr" type="hidden" value="我已隱藏起來"/>
<div></div>
<script type="text/javascript">
var $strHTML = $("input:hidden").val();
$("div").html($strHTML);
</script>
</body>:visible過濾選擇器
:visible過濾選擇器獲取的是全部可見的元素，也就是說，只要不將元素的display屬性值設置爲“none”，那麼，都可以通過該選擇器獲取。
例如：
<body>
<h3>修改可見“水果”的背景色</h3>
<ul>
<li style="display:none">橘子</li>
<li style="display:block">香蕉</li>
<li style="display:">葡萄</li>
<li>蘋果</li>
<li style="display:none">西瓜</li>
</ul>
<script type="text/javascript">
$("li:visible").css("background-color","blue");
</script>
</body>[attribute=value]屬性選擇器
[attribute=value]屬性選擇器的功能是獲取與屬性名和屬性值完全相同的全部元素，其中[]是專用於屬性選擇器的括號符，參數attribute表示屬性名稱，value參數表示屬性值。
例如：
<body>
<h3>改變"title"屬性值爲"蔬菜"的背景色</h3>
<ul>
<li title="蔬菜">茄子</li>
<li title="水果">香蕉</li>
<li title="蔬菜">芹菜</li>
<li title="水果">蘋果</li>
<li title="水果">西瓜</li>
</ul>
<script type="text/javascript">
$("li[title='蔬菜']").css("background-color", "green");
</script>
</body>[attribute!=value]屬性選擇器
[attribute!=value]屬性選擇器的功能是獲取不包含屬性名，或者與屬性名和屬性值不相同的全部元素，其中[]是專用於屬性選擇器的括號符，參數attribute表示屬性名稱，value參數表示屬性值。
[attribute*=value]屬性選擇器
[attribute*=value]它可以獲取屬性值中包含指定內容的全部元素，其中[]是專用於屬性選擇器的括號符，參數attribute表示屬性名稱，value參數表示對應的屬性值。
例如：
<body>
<h3>改變"title"屬性值包含"果"的背景色</h3>
<ul>
<li title="蔬菜">茄子</li>
<li title="水果">香蕉</li>
<li title="蔬菜">芹菜</li>
<li title="人蔘果">小西紅柿</li>
<li title="水果">西瓜</li>
</ul>
<script type="text/javascript">
$("li[title*='果']").css("background-color", "green");
</script>
</body>:first-child子元素過濾選擇器
:first-child子元素過濾選擇器則可以獲取每個父元素中返回的首個子元素，它是一個集合，常用多個集合數據的選擇處理。
例如：
<body>
<h3>改變每個"蔬菜水果"中第一行的背景色</h3>
<ol>
<li>芹菜</li>
<li>茄子</li>
<li>蘿蔔</li>
<li>大白菜</li>
<li>西紅柿</li>
</ol>
<ol>
<li>橘子</li>
<li>香蕉</li>
<li>葡萄</li>
<li>蘋果</li>
<li>西瓜</li>
</ol>
<script type="text/javascript">
$("li:first-child").css("background-color", "green");
</script>
</body>
:last-child子元素過濾選擇器
與:first-child子元素過濾選擇器功能相反，:last-child子元素過濾選擇器的功能是獲取每個父元素中返回的最後一個子元素，它也是一個集合，常用多個集合數據的選擇處理。