Question

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

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

$('.topitem').each(function(){
    $(this).html($(this).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>
</div>

Answer 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>

Answer 2

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

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

删除但保留html

2 个答案: