//---------------------------- 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元素,返回:集合元素