仅选择第一级嵌套元素 [英] select only 1st level of nested elements

问题描述

我们有以下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.

推荐答案

解决自己： http://jsfiddle.net/oceog/3pGXv/

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;
    }

这篇关于仅选择第一级嵌套元素的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！