2

我有一个小问题，我需要计算元素的嵌套级别。问题是父元素可以包含多个子元素，而子元素可以有自己的子元素。

请查看我想从哪里开始计数（标有文字“我从这里开始”）。

HTML：

<div class="main_set">
    <div class="child_set">
        <div class="child_set">
            <div class="child_set">I start here!</div>
        </div>
        <div class="child_set"></div>
    </div>
    <div class="child_set">
        <div class="child_set"></div>    
    </div>
</div>

我已经尝试了几件事来获得计数 3。
例如我的最后一次尝试：

$(this).closest('.main_set').find('.child_set');

这显然返回 6 计算所有 child_sets。

如何计算从开始位置到仅考虑嵌套child_set的元素。main_set所以基本上在我的例子中如何获得计数 3？

4

4 回答 4

8

您可以使用parents() fromthis查找所有父母（使用特殊选择器）；对于长度，您必须为当前添加一个。

alert($(this).parents('.child_set').length + 1);

另请参阅此示例。

于 2012-07-10T18:11:37.880 回答
1

如果你想计算child_set从 div 开始的所有内容I start here!，你可以这样做：

$(this).parents('.child_set').length + 1

这会给你3。1添加 是因为您的带有文本的 div也I start here!具有child_set类。

文档：

于 2012-07-10T18:13:29.940 回答
1

您必须调用 stopPropagation 否则它将调用父事件，因为它们具有相同的 class child_set。

 $('.main_set').on('click', '.child_set', function(e) {
        e.stopPropagation();
        console.log($(this).parents('.child_set').andSelf().length);
    });

工作演示

看看这个其他演示：链接
在这里你可以看到它适用于任何 div。

于 2012-07-10T18:17:26.953 回答
0

使用.children()而不是.find()

这里明确说

.children() 方法与 .find() 的不同之处在于 .children() 仅沿 DOM 树向下移动一个级别，而 .find() 也可以向下遍历多个级别以选择后代元素（孙子等）。

于 2012-07-10T18:10:29.933 回答