关闭

jQuery学习心得----第二集:层次选择器和过滤选择器

标签: jquery层次选择器过滤选择器
130人阅读 评论(0) 收藏 举报
分类:

小编前面两篇文章向大家介绍了一下什么是jQuery选择器,今天呢,将会说说高级一点的选择器,层次选择器和过滤选择器。

层次选择器:

顾名思义,层次选择器就是说利用元素之间的层次关系来选择我们需要的元素。通过查阅书籍资料,我简单总结了一下以下几种层次选择器:

1.$("#tb tr")在上一篇文章里有这个,tb是一个table的id,这样写表示选择id为tb的table下的tr(行);$("div p")选择div里所有的p元素(即div下的所有后代p元素)。

2.$("div>p"),这样写的意思是选择div元素下的子p元素。与第一个的区别在于,一个是后代p元素,一个是子p元素。后代元素和子元素的区别不懂可以另百度。

3.$(".one+div"),选择class为one的下一个同辈div元素,$(".one+div")=$(".one").next("div");

4.$(".one~div"),选择class为one的后面的所有同辈div元素,$(".one~div")=$(".one").nextAll("div");

过滤选择器:

就是说按照一定的条件来筛选需要的元素。我就举几个常用的吧。

1.$(":focus").css("background","#00FFCC");表示改变当前获取焦点的元素的背景色。

2.$("div:contains(dihe)").css("background","#00FFCC");表示改变含有文本“dihe”的div元素的背景色。

3.$("div:has(.one)").css("background","#00FFCC");表示改变含有class为one的div的背景色。

4.$("div:visible"),$("div:hidden")选择可见的idv和不可见的div。

5.$("div[title=sd]").css("background","#00FFCC");选择属性title等于sd的div,更改背景色。

6.$('input:radio[name="sex"]:checked').val(),获取已选择的radio的value值,radio的name为sex。

7.$("select :selected").text();获取下拉框选中的内容。

暂时就写这么多吧,希望能帮助到跟我一样的初学者,一起在项目实践中慢慢积累。

0
0

查看评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
    个人资料
    • 访问:8349次
    • 积分:212
    • 等级:
    • 排名:千里之外
    • 原创:13篇
    • 转载:1篇
    • 译文:0篇
    • 评论:1条
    文章分类
    最新评论