Question

我有以下html：

<h1>These are <span style="color: red;">RED</span> words</h1>
<h2>These are <span class="green">GREEN</span> words</h2>
<h3>These are more <span style="color: red;">RED</span> words</h3>

我想：

<h1>These are RED words</h1>
<h2>These are <span class="green">GREEN</span> words</h2>
<h3>These are more RED words</h3>

换句话说，我想使用javascript或jquery来删除<span style="color: red;"></span>，但保留其他所有内容。并且span标签没有id，只是用于区分它们的样式。

感谢您的帮助。

Answer 1

您可以使用unwrap()。 Here您可以找到文档。另请记住检查span是否包含属性style。

＆＃13;

$('h1, h2, h3').find('span').each(function(){
    if($(this).attr('style')){
      $(this).contents().unwrap();
    }
})

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<h1>These are <span style="color: red;">RED</span> words</h1>
<h2>These are <span class="green">GREEN</span> words</h2>
<h3>These are more <span style="color: red;">RED</span> words</h3>

＆＃13;

Answer 2

这也有效：

$('h1').text($('h1').text())
$('h3').text($('h3').text())

当然，您仍然需要逻辑来测试跨度上是否存在样式，只显示有另一种方法可以删除跨度并保留文本。

删除某些span标签，保持文本内部 - Javascript / jquery

2 个答案: