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

小编前面两篇文章向大家介绍了一下什么是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();获取下拉框选中的内容。

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