Jq选择器

一、基本选择器

id选择器：$('#one').css("background", "#bfa");

class选择器：$('.mini').css("background", "#bfa");

选择器：选中所有的元素：$('').css("background", "#bfa");

二、层次选择器

$("div>h1").css("color","red");//直系后代选择器

$(".three").next("li").css("background","red");//next下一个相邻的兄弟元素

$(".three").nextAll("li").css("border","1px solid red");//后面所有的相邻兄弟元素

三、过滤选择器

$("li:first").css("color","red");//选择第一个

$("li:last").css("color","blue");//选择最后一个

$("ul:first>li:not(.active)").css("border","1px solid red");//:not(取非..的元素)

$("div:last>ul>li:odd").css("background","red");// odd 偶数

$("div:last>ul>li:even").css("background","blue");// even奇数

$("div:eq(1)>ul>li:eq(2)").css("font-size","36px");//eq(x) (取指定索引的元素)

$(":header").css("color","red");//07:header(选择h1-h6标题元素)

四、内容过滤选择器

$("li:contains('javascript')").css("color","red");//contains(text)(取包含 text文本的元素)

$("li:empty").css("background","green");//empty(取不包含子元素或文本为空的元素)

$("li:has(span)").css("border","1px solid red");//has(selector)(取选择器匹配的元素)

$("li:parent").css("font-size","30px");//04 :parent(取包含子元素或文本的元素)