首页 > jquery网页培训班 > jquery 获取子元素|jQuery过滤器获取元素的方法

jquery 获取子元素|jQuery过滤器获取元素的方法

发布-网页培训班 | 浏览量-

通过过滤器("滤镜"),主要用来获取集合性的元素,尤其适用于需要操作的列表或表标签的情况下,通过("元素名:过滤器名")来使用这种方法

html代码

 <ul>
      <li>第0个li元素变为红色</li>
      <li><h1>第1个li元素不变色</h1></li>
      <li>第2个li元素不变色dd</li>
      <li>第3个li元素不变色</li>
      <li>第4个li元素不变色</li>
      <li>第5个li元素不变色</li>
       <li></li>
      <li>bbbb<span>bbbbb</span></li>
    </ul>

1.获取第一个li元素
var li_query=$("li:first");

2.获取最后一个li元素
var li_query=$("li:last");

3.获取第指定li外元素
var li=$("li:not(:first)").css("fontSize","25");

4.获取偶数序号的元素
var li=$("li:even").css("color","blue");

5.获取奇数序号的元素
var li=$("li:odd").css("color","blue");

6.获取指定序号的元素
var li=$("li:eq(2)").css("fontSize","25");

7.获取指定序号后的元素
var li=$("li:gt(2)").css("fontSize","20");

8.获取指定序号前的元素
var li=$("li:lt(2)").css("fontSize","12");

9.获取页面所有<h>标题元素
var li=$("li:header").css("fontSize","30");

10.获取包含指定字符串的元素
var li=$("li:contains('dd')").css("color","blue");

11.获取空元素
var li=$("li:empty").text("空元素").css("color","red");

12.获取非空元素
var li=$("li:parent").css("color","red");

13.获取有子孙元素的元素
var li=$("li:has(span)").css("fontSize","50");

14.获取所有正在执行动画效果的元素
var li=$("li:animated");

上面是对li列表标签操作的,当然也可以对页面中的input,特别是表格进行操作,比如对表格的偶数行和奇数行显示不通的样色,为了区分页面中的表格,可以用id区分一下

 <table id="tt">
      <tr>
        <td>第一个td</td>
      </tr>
      <tr>
        <td>第二个td</td>
      </tr>
      <tr>
        <td>第三个td</td>
      </tr>
      <tr>
        <td>第四个td</td>
      </tr>
      <tr>
        <td>第五个td</td>
      </tr>
   </table>
     <table>
      <tr>
        <td>第一个td</td>
      </tr>
      <tr>
        <td>第二个td</td>
      </tr>
      <tr>
        <td>第三个td</td>
      </tr>
      <tr>
        <td>第四个td</td>
      </tr>
      <tr>
        <td>第五个td</td>
      </tr>
   </table>
jquery:

$("#tt tr:even").css("background-color", "#bbbbff");
$("#tt tr:odd").css("background-color", "red");

原文地址:http://www.35ui.cn/post/20110612173.html

标签jQuery教程jquery

上一条: JS换皮肤及cookie读写大全
下一条: 安全防范SQL注入漏洞_安全sql注入防范代码

或许你还对下面的文章感兴趣