javascript - 计算伪元素中的元素和输出

Question

我有一个类名为“vc_tta-panels”的 div。在这个 div 中有几个类名为“vc_tta-panel”的 div。我想计算 vc_tta-panels div 中的 div。我怎样才能做到这一点？以及如何使用 content: ""; 在类名为 'menu-item-4331::after' 的 li 伪元素中的不同页面上显示计数结果；在 CSS 中？

<div class="vc_tta-panels">
  <div class="vc_tta-panel"></div>
  <div class="vc_tta-panel"></div>
  <div class="vc_tta-panel"></div>
</div>

Answer 1

仅计算子 div:

var divsNumber = $('.vc_tta-panels > div').length;

但是如果你想要所有的div， child 和 child 的 child ....

var divsNumber = $('.vc_tta-panels div').length;

$(document).ready(function(){
    var divsNumber = $('.vc_tta-panels > div').length;
    console.log('Numbers: ' + divsNumber);
    });

 <script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
 
 <div class="vc_tta-panels">
  <div class="vc_tta-panel"></div>
  <div class="vc_tta-panel"></div>
  <div class="vc_tta-panel"></div>
</div>

要将它发送到另一个页面，您可以使用查询字符串:

 var divsNumber = $('.vc_tta-panels > div').length;
 window.location.href = ANOTHERPAGE.html?number=divsNumber;

然后在另一个页面中得到这个数字:

<script>
    (function ($)
    {
        $.QueryString = (function (a)
        {
            if (a == "") return {};
            var b = {};
            for (var i = 0; i < a.length; ++i)
            {
                var p = a[i].split('=');
                if (p.length != 2) continue;
                b[p[0]] = decodeURIComponent(p[1].replace(/\+/g, " "));
            }
            return b;
        })(window.location.search.substr(1).split('&'))
    })(jQuery);
    var num = $.QueryString["number "];
    $('.menu-item-4331').after().css('content', num);
</script>