删除但保留html

时间:2018-03-05 11:06:56

标签: jquery

我正在尝试删除空格,但每个解决方案都会继续删除目标元素的内部hmtl。如何仅删除& nbsp部分?

更新:意识到它不会删除任何html,但我的span元素在运行脚本时被放置在父标记之外。

$('.topitem').each(function(){
    $(this).html($(this).html().replace(/ /gi,''));
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="topitem">
  <div>
    <a href="#" title="text" class="desc">
      <span style="text-align:center;">
         <a href="#"><img src="#" alt="text"></a>text
      </span>
    </a>
  </div>&nbsp;<em></em>
</div>

2 个答案:

答案 0 :(得分:1)

如果您对结果有疑问,可以将font-size设置为零,因此space内没有.topitem(或其他所有内容)的输出。在这种情况下,您只能使用css,不需要使用javascript来完成此任务。

.topitem {
  font-size: 0px;
}

.topitem * {
  font-size: 14px;
}
<div class="topitem">
  <div>
    <a href="#" title="text" class="desc">
      <span style="text-align:center;"><a href="#"><img src="#" alt="text" /></a>text</span>
    </a>
  </div>
  &nbsp;test
  <em>em content</em>
</div>

如果你想留下替换,那就像你在问题中那样简单。但由于您的示例中只有一个项目,并且根本没有p标记,因此请在此处使用class作为选择器。如果您有多个项目,只需再次放置each,但p使用.topitem

$('.topitem').html($('.topitem').html().replace(/&nbsp;/gi, ''));
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="topitem">
  <div>
    <a href="#" title="text" class="desc">
      <span style="text-align:center;"><a href="#"><img src="#" alt="text" /></a>text</span>
    </a>
  </div>
  &nbsp;
  <em>em content</em>
</div>

答案 1 :(得分:0)

1st - 你的选择器$('p') - 在html代码中不存在。 您可以通过示例替换所有dom元素和选择器:

    $(".topitem").html(function (i, html) {
        return html.replace(/&nbsp;/g, '');
    });