jquery选择器之基本过滤选择器详解

 更新时间:2014年01月27日 10:11:49   作者:  
本篇文章主要是对jquery选择器之基本过滤选择器进行了介绍,需要的朋友可以过来参考下,希望对大家有所帮助
复制代码 代码如下:

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

复制代码 代码如下:

<body>
   <h3>各省市行政区划</h3>
   <table border="1" width="50%">
    <thead>
     <tr>
      <th>北京</th>
      <th>上海</th>
      <th>商丘</th>
     </tr>
    </thead>
    <tbody>
     <tr>
      <td>海淀</td>
      <td>徐汇</td>
      <td>睢阳</td>
     </tr>
     <tr>
      <td>朝阳</td>
      <td>闸北</td>
      <td>梁园</td>
     </tr>
     <tr>
      <td>昌平</td>
      <td>黄埔</td>
      <td>柘城</td>
     </tr>
    </tbody>
   </table>
  </body>

一、:first
复制代码 代码如下:

$("tr:first").addClass("highlight"); //获取匹配的第一个tr元素



二、:last()
复制代码 代码如下:

$("tr:last").addClass("highlight"); //获取匹配的最后一个tr元素



三、:not(selector)
复制代码 代码如下:

$("td:not(:even)").addClass("highlight");//获取除了索引是偶数的td




四、:even
复制代码 代码如下:

$("tr:even").addClass("highlight");  //匹配所有索引值为偶数的元素,从 0 开始计数



五、:odd
复制代码 代码如下:

$("tr:odd").addClass("highlight");  //匹配所有索引值为奇数的元素,从 0 开始计数



六、:eq(index)
复制代码 代码如下:

$("tr:eq(2)").addClass("highlight");   //匹配一个给定索引值的元素



七、:gt(index)
复制代码 代码如下:

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



八、:lt(index)
复制代码 代码如下:

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



九、:header
复制代码 代码如下:

$(":header").addClass("highlight");   //匹配如 h1, h2, h3之类的标题元素

相关文章

  • jquery 无限级联菜单案例分享

    jquery 无限级联菜单案例分享

    phpcms的地区级联菜单,感觉写的挺有意思于是自己也实现了个,感兴趣的各位路过的可以参考下哈,希望本例可以帮助到你
    2013-03-03
  • jquery 判断是否支持Placeholder属性的方法

    jquery 判断是否支持Placeholder属性的方法

    下面小编就为大家带来一篇jquery 判断是否支持Placeholder属性的方法。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-02-02
  • jQuery中live方法的重复绑定说明

    jQuery中live方法的重复绑定说明

    使用jQuery的live()方法绑定事件,有时会出现重复绑定的情况,如,当点击一个按钮时,此按钮所绑定的事件会并执行n遍
    2011-10-10
  • jquery插件corner实现圆角边框的方法

    jquery插件corner实现圆角边框的方法

    这篇文章主要介绍了jquery插件corner实现圆角边框的方法,实例分析了jQuery插件corner的使用技巧,具有一定参考借鉴价值,需要的朋友可以参考下
    2015-03-03
  • jQuery的实现原理的模拟代码 -1 核心部分

    jQuery的实现原理的模拟代码 -1 核心部分

    最近又看了一下 jQuery 1.4.2, 为了便于理解,将 jQuery 的核心使用比较简单的代码模拟一下。方便学习。
    2010-08-08
  • jQuery动态移除与增加onclick属性的方法详解

    jQuery动态移除与增加onclick属性的方法详解

    这篇文章主要介绍了jQuery动态移除与增加onclick属性的方法,结合实例形式分析了jQuery使用attr与removeAttr方法针对元素属性动态操作相关实现技巧,需要的朋友可以参考下
    2018-06-06
  • Jquery插件编写简明教程

    Jquery插件编写简明教程

    这篇文章主要介绍了Jquery插件编写简明教程,jquery插件开发实例,需要的朋友可以参考下
    2014-03-03
  • jquery 输入框查找关键字并提亮颜色的实例代码

    jquery 输入框查找关键字并提亮颜色的实例代码

    下面小编就为大家分享一篇jquery 输入框查找关键字并提亮颜色的实例代码,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2018-01-01
  • jQuery使用bind函数实现绑定多个事件的方法

    jQuery使用bind函数实现绑定多个事件的方法

    这篇文章主要介绍了jQuery使用bind函数实现绑定多个事件的方法,结合简单实例形式分析了jQuery使用bind函数进行多个事件绑定的操作技巧与注意事项,需要的朋友可以参考下
    2017-10-10
  • jQuery 相关控件的事件操作分解

    jQuery 相关控件的事件操作分解

    JQuery是非常棒的JS类库,有丰富的UI库和插件,不过我钟爱他的是他的选择器,感觉其他功能有时跟后台人员距离很远,所以一般我也只使用一下他的选择器。
    2009-08-08

最新评论