Jquery基本、层次选择器
基本选择器:
$("#none").css("background","#bbffaa");
改变id为none的所有元素的背景色
$(".mini").css("background","#bbffaa");
改变class为mini的所有元素的背景色
$("*").css("background","#bbffaa");
改变所有元素的背景色
$("span,#two").css("background","#ddffaa");
改变所有<span>元素和id 为two的元素的背景色
层次选择器
$("ancestor descendant")
选取ancestor元素里的所有descendant(后代)元素
$("div span")选取<div>里所有的<span>元素
$("parent>child")
选取parent元素下的child(子)元素,与$("ancestor descendant")有区别,$("ancestor descendant")选择的是后代元素
$("div>span")选取<div>元素下元素名是<span>的子元素
$("prev + next")
选取紧接在prev元素后的next元素
$(".one+div")选取class为none的下一个<div>同辈元素
$("prev~siblings")
选取prev元素之后的所有siblings元素
$("#two~div")选取id为two的元素后面的所有的<div>同辈元素
$("body div").css("background","#bfa");
改变<body>内所有<div>的背景色
$("body>div").css("background"."#bfa");
改变<body>内子<div>元素的背景色
$(".one+div").css("background","#bfa");
改变class为one的下一个<div>同辈元素背景色
$("#two - div").css("background","#bfa");
改变id为two的元素后面的所有<div>同辈元素的背景色
等价关系
$(".one+div") 与 $(".one").next("div") 相等
$("#prev~div") 与 $("#prev").nextAll("div") 相等
摘自《锋利的JQuery》 第二章 2.31 基本选择器 2.3.2 层次选择器