<script>
/*层次选择器*/
$(document).ready(function(){
//1,后代元素选择器
//css()方法设置多种样式({})
$("#div1 ul li").css({"color":"blue","fontSize":"35px"});
//2,子元素选择器(只包括儿子元素)
$("#div2 > span").css("background","green");
//3,相邻元素选择器(紧接着前一个元素后面的元素)
$("#div1 ul + div").css({"fontSize":"50px","background":"red"});
//4,兄弟元素选择器
$("span~.div").css({"background":"red","fontSize":"50px"});
});
</script>
</head>
<body>
<div id="div1">
<ul>
<li>这是第一个li</li>
<li>这是第二个li</li>
</ul>
<div id="div2">
<span>这是一个span元素</span>
<div class="div">这是第二个div</div>
</div>
</div>
</body>
/*层次选择器*/
$(document).ready(function(){
//1,后代元素选择器
//css()方法设置多种样式({})
$("#div1 ul li").css({"color":"blue","fontSize":"35px"});
//2,子元素选择器(只包括儿子元素)
$("#div2 > span").css("background","green");
//3,相邻元素选择器(紧接着前一个元素后面的元素)
$("#div1 ul + div").css({"fontSize":"50px","background":"red"});
//4,兄弟元素选择器
$("span~.div").css({"background":"red","fontSize":"50px"});
});
</script>
</head>
<body>
<div id="div1">
<ul>
<li>这是第一个li</li>
<li>这是第二个li</li>
</ul>
<div id="div2">
<span>这是一个span元素</span>
<div class="div">这是第二个div</div>
</div>
</div>
</body>