快捷導(dǎo)航

jquery選擇器之基本過(guò)濾選擇器詳解

更新時(shí)間：2014年01月27日 10:11:49 作者：

本篇文章主要是對(duì)jquery選擇器之基本過(guò)濾選擇器進(jìn)行了介紹，需要的朋友可以過(guò)來(lái)參考下，希望對(duì)大家有所幫助

<style type="text/css">
  /*高亮顯示*/
  .highlight{   
   background-color: gray
  }
 </style>

復(fù)制代碼代碼如下:

<body>
   <h3>各省市行政區(qū)劃</h3>
   <table border="1" width="50%">
    <thead>
     <tr>
      <th>北京</th>
      <th>上海</th>
      <th>商丘</th>
     </tr>
    </thead>
    <tbody>
     <tr>
      <td>海淀</td>
      <td>徐匯</td>
      <td>睢陽(yáng)</td>
     </tr>
     <tr>
      <td>朝陽(yáng)</td>
      <td>閘北</td>
      <td>梁園</td>
     </tr>
     <tr>
      <td>昌平</td>
      <td>黃埔</td>
      <td>柘城</td>
     </tr>
    </tbody>
   </table>
  </body>

一、:first

復(fù)制代碼代碼如下:

$("tr:first").addClass("highlight"); //獲取匹配的第一個(gè)tr元素

二、:last()

復(fù)制代碼代碼如下:

$("tr:last").addClass("highlight"); //獲取匹配的最后一個(gè)tr元素

三、:not(selector)

復(fù)制代碼代碼如下:

$("td:not(:even)").addClass("highlight");//獲取除了索引是偶數(shù)的td

四、:even

復(fù)制代碼代碼如下:

$("tr:even").addClass("highlight");  //匹配所有索引值為偶數(shù)的元素，從 0 開始計(jì)數(shù)

五、:odd

復(fù)制代碼代碼如下:

$("tr:odd").addClass("highlight");  //匹配所有索引值為奇數(shù)的元素，從 0 開始計(jì)數(shù)

六、:eq(index)

復(fù)制代碼代碼如下:

$("tr:eq(2)").addClass("highlight");   //匹配一個(gè)給定索引值的元素

七、:gt(index)

復(fù)制代碼代碼如下:

$("tr:gt(1)").addClass("highlight");  //匹配所有大于給定索引值的元素

八、:lt(index)

復(fù)制代碼代碼如下:

$("tr:lt(2)").addClass("highlight");  //匹配所有小于給定索引值的元素

九、:header

復(fù)制代碼代碼如下:

$(":header").addClass("highlight");   //匹配如 h1, h2, h3之類的標(biāo)題元素

您可能感興趣的文章:

相關(guān)文章

jquery 無(wú)限級(jí)聯(lián)菜單案例分享
phpcms的地區(qū)級(jí)聯(lián)菜單，感覺(jué)寫的挺有意思于是自己也實(shí)現(xiàn)了個(gè)，感興趣的各位路過(guò)的可以參考下哈，希望本例可以幫助到你
2013-03-03
jquery 判斷是否支持Placeholder屬性的方法
下面小編就為大家?guī)?lái)一篇jquery 判斷是否支持Placeholder屬性的方法。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2017-02-02
jQuery中l(wèi)ive方法的重復(fù)綁定說(shuō)明
使用jQuery的live()方法綁定事件，有時(shí)會(huì)出現(xiàn)重復(fù)綁定的情況，如，當(dāng)點(diǎn)擊一個(gè)按鈕時(shí)，此按鈕所綁定的事件會(huì)并執(zhí)行n遍
2011-10-10
jquery插件corner實(shí)現(xiàn)圓角邊框的方法
這篇文章主要介紹了jquery插件corner實(shí)現(xiàn)圓角邊框的方法,實(shí)例分析了jQuery插件corner的使用技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下
2015-03-03
jQuery的實(shí)現(xiàn)原理的模擬代碼 -1 核心部分
最近又看了一下 jQuery 1.4.2, 為了便于理解，將 jQuery 的核心使用比較簡(jiǎn)單的代碼模擬一下。方便學(xué)習(xí)。
2010-08-08
jQuery動(dòng)態(tài)移除與增加onclick屬性的方法詳解
這篇文章主要介紹了jQuery動(dòng)態(tài)移除與增加onclick屬性的方法,結(jié)合實(shí)例形式分析了jQuery使用attr與removeAttr方法針對(duì)元素屬性動(dòng)態(tài)操作相關(guān)實(shí)現(xiàn)技巧,需要的朋友可以參考下
2018-06-06
Jquery插件編寫簡(jiǎn)明教程
這篇文章主要介紹了Jquery插件編寫簡(jiǎn)明教程,jquery插件開發(fā)實(shí)例,需要的朋友可以參考下
2014-03-03
jquery 輸入框查找關(guān)鍵字并提亮顏色的實(shí)例代碼
下面小編就為大家分享一篇jquery 輸入框查找關(guān)鍵字并提亮顏色的實(shí)例代碼，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧
2018-01-01
jQuery使用bind函數(shù)實(shí)現(xiàn)綁定多個(gè)事件的方法
這篇文章主要介紹了jQuery使用bind函數(shù)實(shí)現(xiàn)綁定多個(gè)事件的方法,結(jié)合簡(jiǎn)單實(shí)例形式分析了jQuery使用bind函數(shù)進(jìn)行多個(gè)事件綁定的操作技巧與注意事項(xiàng),需要的朋友可以參考下
2017-10-10
jQuery 相關(guān)控件的事件操作分解
JQuery是非常棒的JS類庫(kù)，有豐富的UI庫(kù)和插件，不過(guò)我鐘愛他的是他的選擇器，感覺(jué)其他功能有時(shí)跟后臺(tái)人員距離很遠(yuǎn)，所以一般我也只使用一下他的選擇器。
2009-08-08