JQuery选择器

//---------------------------- JQuery选择器 -------------------------------

·JQuery完善的处理机制

document.getElementById("test").style.color ="red";//如果test不存在，则页面出现异常

$("#test").css("color","red");//哪怕页面没有名称为test的元素，也不会报错。它是一个JQuery对象

·判断页面是否选择的对象

if( $(".class").length > 0 ){

// todo something

}

·基本选择器

$("#myDiv")//根据给定的ID选择匹配的元素，返回：单个元素

$(".myClass")//根据给定的样式名称选择匹配的元素，返回：集合元素

$("div")//根据给定的元素名称选择匹配的元素，返回：集合元素

$("#myDiv,div.myClass,span")//根据给定的规则选择匹配的元素，返回：集合元素

$("*")//选择页面所有元素，返回：集合元素

·层次选择器

$("div span")//选择所有DIV元素下的所有SPAN元素（所有后代元素），返回：集合元素

$("div>span")//选择所有DIV元素下的SPAN子元素（仅子元素），返回：集合元素

$(".myClass+div")//选择样式名称为myClass的下一个DIV元素，返回：集合元素

(".myClass").next("div");

$(".myClass~div")//选择样式名称为myClass之后的所有DIV元素，返回：集合元素

(".myClass").nextAll();

$(".myClass").siblings("div")//选择样式名称为myClass的元素的所有同辈DIV元素（无论前后），返回集合元素

·过滤选择器（index从0开始）

$("div:first")//选择所有DIV元素下的第一个DIV元素，返回：单个元素

$("div:last")//选择所有DIV元素下的最后一个DIV元素，返回：单个元素

$("div:not(.myClass)")//选择所有样式不包括myClass的DIV元素，返回：集合元素

$("div:even")//选择所有索引是偶数的DIV元素，返回：集合元素

$("div:odd")//选择所有索引是奇数的DIV元素，返回：集合元素

$("div:eq(index)")//选择所有索引等于index的DIV元素，返回：集合元素

$("div:gt(index)")//选择所有索引大于index的DIV元素，返回：集合元素

$("div:lt(index)")//选择所有索引小于index的DIV元素，返回：集合元素

$(":header")//选择所有标题元素（h1,h2,h3），返回：集合元素

$("div:animated")//选择所有正在执行去画的DIV元素，返回：集合元素