jQuery 选择器

jQuery 选择器种类

1. 基本选择器
2. 层次选择器
3. 过滤选择器『简单过滤选择器、内容过滤选择器、可见性过滤选择器、属性过滤选择器、子元素过滤选择器、表单对象属性过滤选择器』
4. 表单选择器

1. 基本选择器

选择器	功能	返回值	举例
#id	id匹配元素	单个元素	$("#divOne").css(“display”,“block”)
.class	类匹配元素	元素集合	$(".clsFrame").css(“display”,“block”)
element	元素名匹配元素	元素集合	$(“div span”).css(“display”,“block”)
*	匹配所有元素	元素集合	$("*").css(“display”,“block”)
select1,selectN	合并匹配元素	元素集合	$("#divOne,clsFrame").css(“display”,“block”)

2. 层次选择器

选择器	功能	返回值	举例	相当于
ancestor descendant	根据祖先元素匹配所有的后代元素	元素集合	$(“div span”).css(“display”,“block”)
parent>child	根据父元素匹配所有的子元素	元素集合	$(“div>span”).css(“display”,“block”)
prev+next	匹配紧跟在prev后的的相邻元素	元素集合	$(“div+span”).css(“display”,“block”)	.next()
prev~siblings	匹配prev之后的所有兄弟元素	元素集合	$(“div~span”).css(“display”,“block”)	.nextAll()

注：ancestor descendant与parent>child所选择的元素是不相同的，前者的层次关系是祖先与所有的后代，后者的层次关系是父子关系

3. 过滤选择器

3.1 简单过滤选择器

选择器	功能	返回值	举例	相当于	better的用法
:first	获取第一个元素	单个元素	$( “tr:first” ).css( “font-style”, “italic” ); 或者 $(“li”).first().css( “background-color”, “red” )	.first()	$( “li” ).filter( “:first” ).css( “background-color”, “red” );
:last	获取最后一个元素	单个元素	$( “tr:last” ).css({ backgroundColor: “yellow”, fontWeight: “bolder” }); 或者 $(“li”).last().css( “background-color”, “red” )	.last()	$( “li” ).filter( “:last” ).css( “background-color”, “red” );
:odd	获取索引值为奇数的元素，索引值从0开始	元素集合