jQuery技术:如何使用jquery从子级到父级查找元素计数?

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

请看我想开始计数的地方(标有“我从这里开始”的文字)。

HTML:

I start here!

我已经尝试了几件事来计算3。
例如我最后一次尝试:

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

这个显然会返回6计数所有child_sets。

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

    您可以使用此中的parents()来查找所有父项(使用特殊选择器); 对于长度,你必须为当前添加一个。

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

    另见本例 。

    如果你想从div开始计算所有child_setI start here!I start here! ,你会这样做:

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

    这会给你3 。 添加1是因为你带有文字的div I start here! 还有child_set类。

    文档:

    您必须调用stopPropagation或者它将调用父事件,因为它们具有相同的类child_set

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

    工作演示

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

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

    这里清楚地说

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

    需要了解更多jQuery教程分享如何使用jquery从子级到父级查找元素计数?,都可以关注jQuery技术分享栏目—计算机技术网(www.ctvol.com)!

      以上就是jQuery教程分享如何使用jquery从子级到父级查找元素计数?相关内容,想了解更多jQuery开发(异常处理)及jQuery教程关注计算机技术网(www.ctvol.com)!)。

      本文来自网络收集,不代表计算机技术网立场,如涉及侵权请联系管理员删除。

      ctvol管理联系方式QQ:251552304

      本文章地址:https://www.ctvol.com/jquerytutorial/982430.html

      (0)
      上一篇 2021年12月13日
      下一篇 2021年12月13日

      精彩推荐