0

各コンテナー内の ('.child') の数をカウントし、各コンテナー内のカウントを含む文を追加したいと思います。

<div class='container'>
     <div class='child'></div>
     <div class='child'></div>
     <div class='child'></div>
     <div class='child'></div>
</div>

<div class='container'>
     <div class='child'></div>
     <div class='child'></div>
</div>

どうやってそれをしますか?IDが必要ですか、それともクラスだけでできますか? きれいな方法を見つけたいです。事前にどうもありがとう

4

4 に答える 4

2
$('.container').each(function(i, obj){
    var children = $(this).find('.child').length;
    $('<p>' + children + ' elements.</p>').appendTo( $(this) );
});
于 2012-04-07T16:21:27.417 に答える
2

.length を使用してそのソースの数を取得します

例...

alert($('.container').children().length);
于 2012-04-07T16:23:15.360 に答える
1

これは、探しているものを処理する必要がある簡単な例です

jQuery

<script>
    $(function(){
        $('.container').each(function(){
            var count=0,child=$(this).find('.child');
            if(child.length>0) {
                count++;
                child.each(function(){
                    $(this).text('This is child number '+count);
                    count++;
                });
            }
        });
    });
</script>

HTML

<div class="container">
    <div class="child"></div>
    <div class="child"></div>
    <div class="child"></div>
    <div class="child"></div>
</div>
<div class="container">
    <div class="child"></div>
    <div class="child"></div>
</div>
于 2012-04-07T16:30:24.183 に答える
1

このフィドルをチェックしてください

上記のhtml構造を与える追加のものは必要ありません

  $('.container').each(function(){

    $(this).prepend('<label> No of children:'
                    +$(this).find('div.child').size()
                    +'</label>');
  });
于 2012-04-07T16:46:09.637 に答える