ID选择器，单个元素

var name = $('#nameinfo');        console.info(name.val());

标签选择器，集合

var span = $("span");        span.css("color","red");

类选择器，集合

var text = $(".text");        text.css("color","blue");

选择器并列选择多个，集合

var mul = $("name,.text,textarea");        mul.css("color","yellow");

在ID和类前指明前缀

当同一个class被不同的标签使用时，

// 选择class属性是a的ul标签$("ul.a").css("color","red");

选择具有多个Class的标签

// 选择class同时为a b 的标签$(".a.b")

通配选择器

$("ul *").size();

不能直接用value获取 value值。而是用val()方法获取value值

选择器返回集合时，可以用size() 返回集合的长度(或者用length属性)

* $().size()

* $().length

高级选择器

后代选择器

某个元素的子节点和孙子节点中的特定节点

等价函数find()

// 选取指定标签下的所有p标签        $(".div p").css("color","red");// 或者使用find("")        $(".div").find("p").css("color","red");

子选择器

只选择子节点，不选择孙子节点

等价函数children()

// 选择了第一个p标记        $(".div > p").css("color","red");// 或者使用children("")        $(".div").children("p").css("color","red");

next 选择器

某节点的后一个相邻的同级节点

等价函数next()

// 改变第二个li元素的样式        $(".li + li").css("color","red");// 或者使用next("")        $(".li").next("li").css("color","red");

nextAll 选择器

某节点后的所有同级节点

nextAll()

// .b 后的所有同级p标签        $(".b ~ p").css("color","red");// 或者nextAll("")        $(".b").nextAll("p").css("color","red");

prev() / prevAll()

同级的上一个节点/ 前面的所有同级节点，与next()类似

siblings()

同级的所有节点，包括前面的后面的(不包括自己)

// 选取所有前面和后面的p标签        $(".b").siblings("p").css("color","red");

nextUntil(“”) / revUntil()

向后遇到指定标签停止 / 向前遇到指定标签停止

PS： find()/children()/next()/nextAll()如果不加参数name参数默认是“*”

属性过滤选择器

[attribute] 获取包含给定属性的元素

[attribute=value] 获取与给定属性值相等的元素集合

[attribute!=value] 获取与给定属性值不等的元素集合（包括没有该属性的）

[attribute^=value] 获取与给定属性值开始的元素集合

[attribute$=value] 获取与给定元素值结尾的元素集合

[attribute*=value] 获取与给定属性值包含value的元素集合

[selector1][selector2][selectorN]

$("ul[id]").addClass("blue")                       // ul元素中具有id属性的元素    $("ul[id=test]").addClass("blue")                  // ul元素中具有id属性，并且id=test的元素    $("div[name='names'][value='no']").addClass("blue") // 同时满足 name="names" value="no" 的div元素