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

标签 javascript css count pseudo-element

我有一个类名为“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>

最佳答案

仅计算子 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>

关于javascript - 计算伪元素中的元素和输出,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42608468/

相关文章:

javascript - Polymer 1.x 和 React

html - 悬停缩放行为在 span 标签内的 img 标签上无法正常工作

c++ - 依靠枚举 C++ 自动

mysql - 如何在子查询中使用 Count?

javascript - 在新窗口中显示隐藏的 div 作为内容

javascript - 操作方法 - jQuery 切换 TextView

php - Htaccess 错误地进行了 301 重定向

MySql Left Join 不保留左表

javascript - 改变一个数即可得到等差数列

html - 在 Chrome 中点击按钮