从 html 字符串中删除所有不需要的标签，但在 JS 中保留空格答案

【问题标题】：Strip all unwanted tags from html string but preserve whitespace in JS从 html 字符串中删除所有不需要的标签，但在 JS 中保留空格
【发布时间】：2015-08-05 10:36:41
【问题描述】：

我正在尝试去除所有不需要的标签的 html 内容，并仅返回具有基本格式（ul、b、u、p 等）的文本或仅返回纯文本（但保留新行、间距等）但是我遇到了麻烦创建一个包罗万象的解决方案，让我保留我粘贴的内容的结构。

示例字符串：

    <p class="Bodytext" style="color: rgb(51, 51, 51);background-color: rgb(255, 255, 255);">
        <span lang="EN-GB">Hello
            <span class="Apple-converted-space"> world,   </span>
            <span class="Cross-reference">
                <a href="" style="color: rgb(66, 139, 202);background-color: transparent;">Cough
                </a>
            </span>
            <span class="Apple-converted-space"></span>and
            <span class="Apple-converted-space"></span>
            <span class="Cross-reference">
                <a href="" style="color: rgb(66, 139, 202);background-color: transparent;">Feverish - risk assessment</a>
            </span>.
            <span class="Apple-converted-space"></span>
        </span>
    </p>
    <p class="Bodytext" style="color: rgb(51, 51, 51);background-color: rgb(255, 255, 255);">
        <span lang="EN-GB">Fin.  </span>
    </p>

【问题讨论】：

获取一个节点的.textContent 怎么样？ developer.mozilla.org/en-US/docs/Web/API/Node/textContent 示例：jsfiddle.net/gLrramna

标签： javascript html css angularjs

【解决方案1】：

这是一个纯 JavaScript 解决方案，用于从 HTML 中删除所有 span 元素，但保留其内部内容：

var span = document.getElementsByTagName('span');
while(span.length) {
    var parent = span[ 0 ].parentNode;
    while( span[ 0 ].firstChild ) {
        parent.insertBefore(  span[ 0 ].firstChild, span[ 0 ] );
    }
     parent.removeChild( span[ 0 ] );
}

您也可以通过使用 jQuery 更简单地做到这一点，如本例所示，它将删除 span 标签，以及 p、b、ul、li 标签，但是留下他们的内在内容：

$("span, p, b, ul, li").contents().unwrap();

另请参阅：Remove a HTML tag but keep the innerHtml

还需要注意的是，只要您有两个或多个连续空格，现代浏览器通常会在它们显示时将它们截断为一个空格。如果您想将空格保留为多个空格，我会将常规键入的空格“”字符替换为“&nbsp;”HTML 编码空格。如果需要，普通 JavaScript 有一个字符串替换方法，你可以使用它。

编辑：如果您希望从 JavaScript 字符串中删除所有 HTML 标记，请尝试以下操作：

myString.replace(/<(?:.|\n)*?>/gm, '');

另见：Strip HTML from Text JavaScript

【讨论】：

嘿，我感谢您的回复，但这不是合适的答案，我只有一个字符串，而不是要使用的 dom，所以我不能只抓取元素并打开它们。这个示例 html 也包含很多跨度，是的，但我希望在我的解析器中考虑任何类型的元素

【解决方案2】：

我能想出的唯一解决方案是这个......

'Name<br /><a href="something">here.</a>'.replace(/(<([^>]+)>)/ig,' ').replace(/\s{2,}/gi, ' ').trim()

我不认为它是最优雅的，但它似乎工作得相当一致。

【讨论】：