jQuery选择器

jQuery选择器

1.jQuery简单选择器

1.1 id选择器

$("#div").css("background","red");

1.2 class选择器

$(".div").css("background","red");

1.3 标签选择器

$("div").css("background","red");

2.jQuery进阶选择器

2.1 群组选择器

$(".div","#div","div").css("background","red");

2.2 后代选择器

$("#div div").css("background","red");

2.3通配选择器

$("*").css("background","red");

3.jQuery高级选择器

3.1 后代选择器和find()方法

后代选择器 var $div=$("#div div");

find(): var $div=$("#div").find("div").css("background","red");

find方法是jq对象的方法，必须要有参数，否则该方法无法返回对应的后代标签

3.2 子元素选择器和children()方法

子元素选择器 var $div=$("#div>div");

children(): var $div=$("#div").children("div");

children方法如果没有参数则获取到的是父标签下所有的一级子标签。如果有参数，则获取的是该参数指定的一级子标签。

3.3 next选择器和next()方法

next选择器 var $div=$("#div+div");

next(): var $div=$("#div").next("div");

next方法：该方法后的参数可以为空，返回的是跟在他后边的标签。

3.4 nextAll选择器和nextAll()方法

nextAll选择器 var $div=$("#div~div");

nextAll(): var $div=$("#div").nextAll("div");

nextAll方法：如果方法后面没有参数，则把当前指定标签后的所有兄弟标签获取到，如果有参数，则获取到参数指定的兄弟标签，排除其他标签

3.5 prev()方法

var $div=$("#div").prev("div");

prev方法：方法后面没有参数，则获取当前标签的上一个标签

3.6 prevAll()方法

var $div=$("#div").prevAll("div");

prevAll方法：方法后面没有参数，则获取当前指定标签前的所有兄弟标签，如果有参数，则获取到参数指定的兄弟标签，排除其他标签

3.7 sibling()方法

var $div=$("#div").sibling("div");

sibling方法：方法后面没有参数，则获取到的是与指定标签同级的兄弟标签