您的位置：首页 > Web前端 > JQuery

新手上路 jquery 选择器篇(二) 代码笔记

2017-07-25 19:48 211 查看

</head>
<body>
<!--层次选择器:
后代选择器   ancestor descendant
子代选择器   parent > child
相邻选择器   prev + next
同辈选择器   prev ~ sibling
-->
<div id="parent">层次选择器
<div id="child" class="testcolor">父选择器
<div class="g">一言通天</div>
<div class="g">天鬼大法</div>
<div class="g">六脉全开</div>
</div>

<div id="">
他兄弟
</div>

</div>

</body>

<script type="text/javascript">

console.log(">=--------后代选择器------->");
//后代选择器
var div1 = $('#parent .g');
div1.each(function(){

console.log(this);
});

console.log(">=--------子代选择器------->");
//子代选择器
var div2 = $('#parent > #child');
div2.each(function(){

console.log(this);
});

console.log(">=--------相邻选择器------->");
//相邻选择器 prev + next
var div3 = $('#child + div ');
div3.each(function(){

console.log(this);
});

console.log(">=--------同辈选择器------->");
//同辈选择器 prev ~ sibling
var div4 = $('.g ~ div');
div4.each(function(){

console.log(this);
});

</script>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签： jquery

相关文章推荐

新的分享

章节导航