javascript - 如何在不同的 div 中附加循环值

Question

我需要附加值不同的 div-s

var thmb_count = thmb_wrap.length;

for( i = 0; i < thmb_count; i++){
    var num = i + 1; 
    thmb_wrap.each(function(){
        $(this).append('<span class="numeric">' + num + '/' + (full) + '</span>');
    });
}

html

<div class="thumb-wrp scrollbar-inner">
    <div class="thm-img"><img src="img/img/a.jpg"></div>
    <div class="thm-img"><img src="img/img/b.jpg"></div>
    <div class="thm-img"><img src="img/img/c.jpg"></div>
    <div class="thm-img"><img src="img/img/d.jpg"></div>
    <div class="thm-img"><img src="img/img/a.jpg"></div>
    <div class="thm-img"><img src="img/img/c.jpg"></div>
    <div class="thm-img"><img src="img/img/b.jpg"></div>
    <div class="thm-img"><img src="img/img/d.jpg"></div>
</div>

Answer 1

您可以遍历 thm-img 并附加 span 之类的内容

var $thumbs = $('.thumb-wrp .thm-img'),
  full = $thumbs.length;
$thumbs.append(function(i) {
  return '<span class="numeric">' + (i + 1) + '/' + (full) + '</span>'
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="thumb-wrp scrollbar-inner">
  <div class="thm-img"><img src="img/img/a.jpg"></div>
  <div class="thm-img"><img src="img/img/b.jpg"></div>
  <div class="thm-img"><img src="img/img/c.jpg"></div>
  <div class="thm-img"><img src="img/img/d.jpg"></div>
  <div class="thm-img"><img src="img/img/a.jpg"></div>
  <div class="thm-img"><img src="img/img/c.jpg"></div>
  <div class="thm-img"><img src="img/img/b.jpg"></div>
  <div class="thm-img"><img src="img/img/d.jpg"></div>
</div>