第二章jQuery选择器

一、jquery选择器的分类：

1.基本选择器

（1）标签选择器

$(“h2”).css(“color”,“red”);

（2）类选择器

$(".title").css(“color”,“red”);

（3）ID选择器

$("#title").css(“color”,“red”);

（4）并集选择器

$(“h2,h3,.title,#title”).css(“color”,“red”);

（5）全局选择器

$("").css(“color”,“red”);
2.层次选择器
（1）后代选择器
$("#box p").css(“color”,“red”)
所有box下面的p标签字体都换成红色
（2）子选择器
$("#box>p").css(“color”,“red”);
所有id为box的儿子元素字体变成红色
（3）相邻元素选择器：
$(".p2+p").css(“color”,“red”);
class为p2的元素下一个为p的字体变红
（4）同辈元素选择器：
( " . p 2   p " ) . c s s ( " c o l o r " , " r e d " ) ; c l a s s 为 p 2 后 面 所 有 为 p 元 素 的 字 体 都 变 成 红 色 3. 属 性 选 择 器 （ 1 ） [ n a m e ] : 含 有 n a m e 属 性 的 选 中 （ 2 ） [ n a m e = ′ n a m e ′ ] ， n a m e 的 值 是 n a m e 的 被 选 中 （ 3 ） [ n a m e ! = n a m e ] , n a m e 的 值 不 是 n a m e 的 被 选 中 （ 4 ） [ n a m e = n a ] ， n a m e 的 值 以 n a 开 头 的 被 选 中 （ 5 ） [ n a m e (".p2~p").css("color","red"); class为p2后面所有为p元素的字体都变成红色 3.属性选择器 （1）[name]:含有name属性的选中 （2）[name='name']，name的值是name的被选中 （3）[name!=name],name的值不是name的被选中 （4）[name^=na]，name的值以na开头的被选中 （5）[name(".p2 p").css("color","red");class为p2后面所有为p元素的字体都变成红色3.属性选择器（1）[name]:含有name属性的选中（2）[name=′name′]，name的值是name的被选中（3）[name!=name],name的值不是name的被选中（4）[name=na]，name的值以na开头的被选中（5）[name=na],name的值以na结束的被选中
（6）[name=na],name的值中包含na的被选中

（7）[name=‘text’][id=‘name’]，属性name的值等于name,并且id也等于name的被选中

4.基本过滤选择器

（1）获取第一个li元素：

$(“li:first”).css(“color”,“red”);

（2）获取最后一个li元素：

$(“li:last”).css(“color”,“red”);

（3）获取偶数行的元素：

$(“li:even”).css(“color”,“red”);

（4）获取奇数行的元素：

$(“li:odd”).css(“color”,“red”);

（5）获取索引是2的元素

$(“li:eq(2)”).css(“color”,“red”);

（6）获取索引大于2的元素，索引从0开始

$(“li:gt(2)”).css(“color”,“red”);

（7）获取索引小于2的元素

$(“li:lt(2)”).css(“color”,“red”);

（8）获取所有标题元素

$(":header").css(“color”,“red”);

（9）获取光标聚焦的元素

$(":focus").css(“color”,“red”);

5.可见性过滤选择器

二、光标聚焦：

$("[name=‘text’]").focus();

三、给表单里面赋值：

$("[name=‘pass’]").val(“值”);

四、获取表单的值：

$("#input").val();