jQuery选择器

选择器是jQuery的根基，在jQuery中，对事件的处理，遍历DOM和Ajax操作都依赖于选择器

基本选择器:6种:

标签选择器

语法：element 返回值：元素集合

标签选择器：

//$("h1").css("color","red")

类选择器

//$(".myclass").css("color","green")

ID选择器 ：

语法：.class 返回值：元素集合

//$("#myid").css("color","yellow")

并集选择器 ：

语法：#id 返回值：单个元素

//$("div#my").css("color","blue")

交集选择器:

语法:selector1, selector2...selectorN 返回值：元素集合

//$("div,#my").css("color","yellow")

全局选择器:

语法:* 返回值：集合元素

$("*").css("color","yellow")

层次选择器：后代选择器：

语法：ancestor descendant 返回值：元素集合

后代选择器：

$("A B").css("color","yellow")

子选择器：

语法：parent>child 返回值：元素集合

定位的只是直接子类

$("A>B").css("color","yellow")

相邻元素选择器：

语法：prev+next 返回值：元素集合

$("A+B").css("color","yellow")

同辈元素选择器：

语法：prev~sibings 返回值：元素集合

锁定prev之后的元素，不能锁定prev之前的元素

$("A~B").css("color","yellow")

属性选择器：

$(“[class=odds]”).css(“background”,”red”)

$(“[id!=box]”).css(“background”,”red”)

Title元素中以h开头：

$(“[title^=h]”).css(“background”,”red”)

Title元素中以jp结尾：

$(“[title$=jp]”).css(“background”,”red”)

Title元素中以含s的：

$(“[title*=s]”).css(“background”,”red”)

包含class属性 且title属性值中含有s的li元素

$(“li[class][title*=s]”).css(“background”,”red”)

过滤选择器：

基本过滤选择器：

//$("li:first").css("background","#09F") //第一个

//$("li:last").css("background","#09F") //最后一个

//$("li:not(.three)").css("background","#09F") //class不为three的

//$("li:even").css("background","#09F") //索引值为偶数的

//$("li:odd").css("background","#09F") //索引值为奇数的

//$("li:eq(1)").css("background","#09F") //索引值等于一

//$("li:gt(1)").css("background","#09F") //索引值大于一

//$("li:lt(1)").css("background","#09F") //索引值小于一

//$(":header").css("background","#09F")

//所有标题

$(":focus").css("background","#09F")

//获取焦点的元素的背景颜色

可见性过滤选择器：

执行结果：