# 层级选择器:
通过DOM的嵌套关系匹配元素
- jQuery层级选择器----包含选择器、子选择器、相邻选择器、兄弟选择器4种
- 包含选择器：
$("a b")在给定的祖先元素下匹配所有后代元素。(不受层级限制) - 子选择器：
$("parent > child")在给定的父元素下匹配所有子元素。 - 相邻选择器：
$("prev + next")匹配所有紧接在prev元素后的next元素。 - 兄弟选择器：
$("prev ~ siblings")匹配prev元素之后的所有sibling元素。
- 包含选择器：
案例：
<BODY>
<!--包含选择器/子选择器/兄弟选择器/相邻选择器-->
<div class="main">
<span>1<img src="images/1.jpg"/></span>
2<img src="images/1.jpg"/>
</div>
3<img src="images/1.jpg">
4<img src="images/1.jpg">
<div>
5<img src="images/1.jpg">
</div>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript">
$(function(){
//$(".main img").css("border","5px solid red");
//$(".main > img").css("border","5px solid blue");
//$(".main + img").css("border","5px solid blue");
$(".main ~ img").css("border","5px solid blue");
});
</script>
</BODY>
@前端进阶之旅: 代码已经复制到剪贴板
综合应用：
<body>
<h1>沁园春·雪</h1>
<h2>毛泽东</h2>
<div>
<span><div>北国风光，千里冰封，万里雪飘。
<div>望长城内外，惟余莽莽；大河上下，顿失滔滔。</div>
<p>山舞银蛇，原驰蜡象，欲与天公试比高。</
