在divs children中查找文本长度

Question

所以我有一组div。每个div包含三个span元素。每个span元素可以包含任意数量的数字。

这是我到目前为止所做的：

var arrayOfDivs = $(".avgMaxClass");
                $.each(arrayOfDivs, function (index, value) {


                });

我想要做的是计算div迭代中所有跨度内所有文本的总长度。我无法弄清楚如何做到这一点。

编辑： 要明确我不想要所有div的总文本长度。我想要迭代的当前div的文本长度

Answer 1

$(".avgMaxClass span").text().length;

JSFiddle demo

修改

正如您在评论中所述，您想知道每个DIV的长度，这是使用jQuery.each()的另一种方式：

var avgMaxClass = $('.avgMaxClass');

$.each(avgMaxClass, function(i,item) {

    // Output span text length for each item
    console.log($("span", item).text().length); 
});

JSFiddle demo

Answer 2

迭代div并找到它的长度。

$(".avgMaxClass").each(function(){
    var thisDivsLength = $(this).find('span').text().length;
    alert("Current div's length: " + thisDivsLength);
});

$.each适用于非jQuery对象。请改用$.fn.each。

DEMO

Answer 3

您可以使用选择器同时获取div和span，或者分割逻辑并单独显示两个部分，您可以使用两个选择器并循环结果每个。

＆＃13;

＆＃13;

var total = 0;
$(".avgMaxClass").each(function(index, value) {
  $(value).find("span").each(function(cindex, child) {
    total += $(child).text().length;
  });
});

$("#result").text("Total length: " + total);

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>


<div class="avgMaxClass">
  <span>1</span>
  <span>12</span>
  <span>123</span>
</div>
<div class="avgMaxClass">
  <span>1234</span>
  <pre>12345</pre>
  <span>12345</span>
</div>
<div class="avgMaxClass">
  <span>123456</span>
  <span>1234567</span>
  <span>12345678</span>
</div>
<div id="result"></div>

＆＃13;

＆＃13;

＆＃13;