jQuery：每场比赛仅appendTo一次

Question

需要将 的内容抛给span .cat上面div，但是这个事件将全部抛给span .cateach div。在出去的路上我得到date category category2 category3date category category2 category3date category category2 category3我需要吗date categorydate category2date category3$(document).ready(function() {  $('.bdt-post-grid-category').wrapInner('<span class="bdt-post-grid-date cat"></span>');  $('.bdt-post-grid-date.cat').appendTo($(".bdt-post-grid-meta"));});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><div class="bdt-post-grid-meta bdt-subnav bdt-flex-middle">  <span class="bdt-post-grid-date">date</span></div><div class="bdt-post-grid-category bdt-position-small bdt-position-top-left">  <a href="#" rel="category tag">category</a></div><div class="bdt-post-grid-meta bdt-subnav bdt-flex-middle">  <span class="bdt-post-grid-date">date</span></div><div class="bdt-post-grid-category bdt-position-small bdt-position-top-left">  <a href="#" rel="category tag">category2</a></div><div class="bdt-post-grid-meta bdt-subnav bdt-flex-middle">  <span class="bdt-post-grid-date">date</span></div><div class="bdt-post-grid-category bdt-position-small bdt-position-top-left">  <a href="#" rel="category tag">category3</a></div>

Answer 1

用于.each()单独处理每个元素，仅附加到前一个元素。

$(document).ready(function() {

  $('.bdt-post-grid-category').wrapInner('<span class="bdt-post-grid-date cat"></span>');

  $('.bdt-post-grid-date.cat').each(function() {

    $(this).appendTo($(this).closest(".bdt-post-grid-category").prev());

  });

});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div class="bdt-post-grid-meta bdt-subnav bdt-flex-middle">

  <span class="bdt-post-grid-date">date</span>

</div>

<div class="bdt-post-grid-category bdt-position-small bdt-position-top-left">

  <a href="#" rel="category tag">category</a>

</div>

<div class="bdt-post-grid-meta bdt-subnav bdt-flex-middle">

  <span class="bdt-post-grid-date">date</span>

</div>

<div class="bdt-post-grid-category bdt-position-small bdt-position-top-left">

  <a href="#" rel="category tag">category2</a>

</div>

<div class="bdt-post-grid-meta bdt-subnav bdt-flex-middle">

  <span class="bdt-post-grid-date">date</span>

</div>

<div class="bdt-post-grid-category bdt-position-small bdt-position-top-left">

  <a href="#" rel="category tag">category3</a>

</div>