使用jQuery从元素中删除除特定内部跨度以外的内容

Question

我有一个包含文本、跨和锚的元素，我希望删除除其中的特定跨度之外的所有内容。这是我使用的html和jQuery：

​

jQuery(function($) {
  $('.post-meta').contents(':not(".published")').remove();
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<p class="post-meta">door <span class="author vcard"><a></a></span> | <span class="published">10 september, 2021</span> | <a>Nieuws</a>,
  <a></a>,
  <a></a> | 0 reacties</p>

​

jQuery运行后的输出：

<p class="post-meta">door  | <span class="published">10 september, 2021</span> | , ,  | 0 reacties</p>

因此，它移除所有元素，但将松散的文本留在p中。

Answer 1

尝尝这个

​

jQuery(function($) {
  $('.post-meta').html(function() { return $(this).find(".published").html()})
});

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

<p class="post-meta">door <span class="author vcard"><a></a></span> | <span class="published">10 september, 2021</span> | <a>Nieuws</a>,
  <a></a>,
  <a></a> | 0 reacties</p>
  
  <p class="post-meta">door <span class="author vcard"><a></a></span> | <span class="published">11 september, 2021</span> | <a>Nieuws</a>,
  <a></a>,
  <a></a> | 0 reacties</p>

​