从父级但不从子级删除标签答案

【问题标题】：Remove tags from parent but not from child从父级但不从子级删除标签
【发布时间】：2019-06-11 03:10:08
【问题描述】：

我想从 <div> 中删除 <br> 标签和 &nbsp; 标签，但不是从子 span 类代码中删除

这是我的 dom 的样子

<div>
 some &nbsp; text
 <br>
 some &nbsp;text
 <br>
 some &nbsp; text

 <span class='code'>//Code
  <pre>
   <p>
    &nbsp;text here 
    <br>
    &nbsp;text here 
    <br>
    &nbsp;text here 
    <br>
   </p>
  </pre>
 </span>

</div>

如何做到这一点是 jquery 或 javascript

【问题讨论】：

标签： javascript jquery regex dom-manipulation

【解决方案1】：

你可以这样做：

var divhtml = $('.code').parent().html().replace(/<br>/g,'').replace(/&nbsp;/g,'');
$('.code').parent().html(divhtml);

【讨论】：

【解决方案2】：

// Get the code span
var codeSpan = document.querySelector("span.code");

// Remove the codeSpan from the DOM
codeSpan.remove();

// Get the div
var div = document.querySelector("div");
var html = div.innerHTML;

// Remove all the <br> and &nbsp; from the div
div.innerHTML = html.replace(/<br>/g,'').replace(/&nbsp;/g,'');

// ---- Alternate approach
// Clear out all the content from the div
// div.innerHTML = "";

// Add the codeSpan back into the div
div.appendChild(codeSpan);

<div>
 some &nbsp; text
 <br>
 some &nbsp;text
 <br>
 some &nbsp; text

 <span class='code'>//Code
  <pre>
   <p>
    &nbsp;text here 
    <br>
    &nbsp;text here 
    <br>
    &nbsp;text here 
    <br>
   </p>
  </pre>
 </span>

</div>

【讨论】：