19-10-15-jQuery选择器

1. id选择器

$(“#box”)

2. class选择器

$(“.box”)

3. 标签名选择器

$(“div”)

4. 标签名选择器

$(“*”)

5. 层级选择器

$(“div>span”)

6.后代

 $("div span")

7.连续的子代

$("div>span>span")

8.群组选择器

 $("div,p")

9.交叉选择器

两个条件必须同时满足

$("#btn.box")

10. 紧邻选择器

条件1: 紧挨着制定目标  (这里的指定目标: .box)

 条件2: 需要在目标的下方书写

$(".box+p")

11. 同辈选择器(同级选择器,同胞选择器)

可以获取到目标下方 所有的元素(无论是否紧邻)

$(".box~p")

12.过滤选择器

 需要匹配的条件:first   

匹配到第一个符合条件的元素

$('li:first')

:last  匹配到最后一个符合条件的元素

$('li:last')

 :not 除了()中指定的条件,获取:前指定的所有元素,

 $("li:not(.list)")

 :even 索引为偶数的

 $("li:even")

 :odd  索引为奇数

$("li:odd:not(.list)")

 :eq(指定索引值)

$("li:eq(0)")

 :gt(大于索引值)

$("li:gt(1)")

:lt(小于索引值)

$("li:lt(5)")

13. 后代选择器和 find()方法

$("p span")

搜索所有段落中的后代 span 元素

$("p").find("span");

14.  子元素选择器和 children 方法

$("p>span")

 取得一个包含 匹配的元素集合中 每一个元素的所有子元素的元素集合

描述:查找DIV中的每个子元素。

        $("p").children().css("fontSize","30px");

描述:在每个div中查找 .selected 的类

 $("div").children(".selected")

4.  紧邻选择器和 next()方法

$(".d+button").html("点我");

$(".d").next().css("color","blue");

nextAll 方法

$(".d").nextAll("button")

prev 方法

$(".d").prev()

prevAll 方法

$(".d").prevAll()

$(".d").prevAll("span")

$("input").val()

siblings 方法

$(".d").siblings("button")

你可能感兴趣的:(19-10-15-jQuery选择器)