本文介绍了仅选择第一级嵌套元素的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我们有以下html:
<div>
<div class="bord" id="1">
parent1
<div class="bord">
child1
<div class="bord">
subchild1
</div>
</div>
</div>
</div>
-----------
<span>
<div class="bord" id="2">
parent1
<div class="bord">
child1
<div class="bord">
subchild1
</div>
</div>
</div>
</span>
需要具有通过电话选择的功能
need to have function that will select with call
a=$('.bord').new_function();
只有在样本中标记为id =1和id =2的元素;
如果在此之后:
only elements marked in sample as id="1" and id="2";if after that:
b=a.new_function();
它应该只选择child1s
it should select child1s only
b.new_function();
应该能够选择subchild1s
should be able to select subchild1s
我尝试了几种方法,现在没有任何想法。
I tried several ways and have no ideas now.
推荐答案
解决自己:
HTML:
<div>
<div class="bord">
parent1
<div class="b2">
b2
<div class="bord">
child1
<div class="bord">
subchild1
</div>
</div>
</div>
</div>
</div>
-----------
<div>
<div class="b2">
b2
<div class="bord">
parent1
<div class="bord">
child1
<div class="b2">
b2
<div class="bord">
subchild1
</div>
</div>
</div>
</div>
</div>
</div>
JS:
jQuery.fn.firstlevel = function(sel) {
var obj = $(this);
if (obj.selector != sel) {
obj = obj.find(sel);
}
obj = obj.not(obj.find(sel));
console.log(obj);
return obj;
}
$('.bord')
.firstlevel('.bord').css('border', '3px solid red')
.firstlevel('.bord').css('border', '3px solid green')
.firstlevel('.bord').css('border', '3px solid blue');
$('.b2')
.firstlevel('.b2').css('border', '1px solid red')
.firstlevel('.b2').css('border', '1px solid green')
.firstlevel('.b2').css('border', '1px solid blue');
css:
.bord
{
border: 1px solid black;
margin: 10px;
}
这篇关于仅选择第一级嵌套元素的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!