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 html添加元素/删除元素操作实例详解

    jquery html添加元素/删除元素操作实例详解

    这篇文章主要介绍了jquery html添加元素/删除元素操作,结合实例形式详细分析了jquery html添加元素/删除元素相关函数功能、用法及操作注意事项,需要的朋友可以参考下
    2020-05-05
  • jQuery 获取和设置select下拉框的值实现代码

    jQuery 获取和设置select下拉框的值实现代码

    jQuery获取和设置select下拉框值的实现代码。需要的朋友可以过来参考下,希望对大家有所帮助
    2013-11-11
  • 经典海量jQuery插件 大家可以收藏一下

    经典海量jQuery插件 大家可以收藏一下

    海量的jQuery插件帖,很经典,不知道什么时候开始流传,很早以前就收藏过,为了工作方便还是发了一份放在日志里面。
    2010-02-02
  • Jquery插件之多图片异步上传

    Jquery插件之多图片异步上传

    为促进大家交流与学习,开源此插件。在此感谢非老大开源!不多说了,先图片后代码。
    2010-10-10
  • jQuery实现朋友圈查看图片

    jQuery实现朋友圈查看图片

    这篇文章主要为大家详细介绍了jQuery实现朋友圈查看图片,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-09-09
  • jQuery 动画与停止动画效果实例详解

    jQuery 动画与停止动画效果实例详解

    这篇文章主要介绍了jQuery 动画与停止动画效果,结合实例形式详细分析了jQuery 动画与停止动画效果相关函数功能、用法及使用注意事项,需要的朋友可以参考下
    2020-05-05
  • jQuery+ajax实现鼠标单击修改内容的思路

    jQuery+ajax实现鼠标单击修改内容的思路

    这篇文章主要介绍了jQuery+ajax实现鼠标单击修改内容的思路及核心代码,需要的朋友可以参考下
    2014-06-06
  • jMessageBox 基于jQuery的窗口插件

    jMessageBox 基于jQuery的窗口插件

    在WinForm程序开发中,经常用MessageBox弹出某些提示,功能虽简单但却非常的实用!而在Web页面中,浏览器也提供了Alert或Confirm等脚本语句用于弹出提示窗口
    2009-12-12
  • jQuery的context属性用法实例

    jQuery的context属性用法实例

    这篇文章主要介绍了jQuery的context属性用法,实例分析了context属性返回节点内容的使用技巧,具有一定的参考借鉴价值,需要的朋友可以参考下
    2014-12-12
  • jquery选择器的选择使用及性能介绍

    jquery选择器的选择使用及性能介绍

    从这一讲开始,我们将直正接触一个JQ类库,学习一下JQ的写法,JQ的一些常用的命令等等,今天主要讲的是JQ里的选择器,这也是JQ的一大特点,这从它的名称jQuery中可以看到,主要功力体现在查询上
    2013-01-01

最新评论