javascript - 如何删除特定标签并保留其内容

Question

我在 contenteditable div 中有一些不需要的标签，需要删除它们。

它们是   和 span

尝试使用 jquery unwrap 函数，但结果是 undefined 因为它删除了父标签而不是标签本身。

有什么帮助吗？在下面的示例中，预期的控制台是:

lorem ipsum lorem ipsum lorem ipsum

$('button').on('click', function(){
  $('span').unwrap();
  console.log($('#story').html());
});

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

<div class='story' id='story'>
loem ipsum &nbsp;<span style="font-size: 1.3em;">lorem ipsum</span> lorem ipsum
</div>
<br>
<button>CLICK</button>

Answer 1

你必须使用like

$("#story").find("span").contents().unwrap();

$('button').on('click', function(){
  $("#story").find("span").contents().unwrap();
  console.log($('#story').html().replace(/ /g, ''));
});

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

<div class='story' id='story'>
loem ipsum &nbsp;<span style="font-size: 1.3em;">lorem ipsum</span> lorem ipsum
</div>
<br>
<button>CLICK</button>