删除 JavaScript 中的 HTML 标签

在 JavaScript 中，删除字符串中的 HTML 标签是一个常见的任务。本文将介绍几种常用的方法来实现这个目标。

方法一：使用正则表达式

function removeHTMLTags(str) {
  return str.replace(/<[^>]*>/g, '');
}

此方法使用正则表达式替换字符串中的所有标签。/<[^>]*>/g 的正则表达式会匹配所有的 HTML 标签，并用空字符串进行替换。

示例用法：

const htmlString = '<h1>Hello, <span>World!</span></h1>';
const textString = removeHTMLTags(htmlString);
console.log(textString);  // 输出: "Hello, World!"

方法二：使用 DOM 解析器

function removeHTMLTags(str) {
  const temp = document.createElement('div');
  temp.innerHTML = str;
  return temp.textContent || temp.innerText;
}

此方法利用 DOM 解析器将 HTML 字符串转换为 DOM 元素，并使用 textContent 或 innerText 属性获取纯文本内容。

示例用法：

const htmlString = '<h1>Hello, <span>World!</span></h1>';
const textString = removeHTMLTags(htmlString);
console.log(textString);  // 输出: "Hello, World!"

方法三：使用第三方库

如果你不想自己编写代码来处理 HTML，也可以使用第三方库来解决这个问题。例如，可以使用 DOMPurify 库来删除 HTML 标签。

首先，使用 npm 安装 DOMPurify：

npm install dompurify

然后，在你的 JavaScript 代码中引入 DOMPurify 并使用它来删除 HTML 标签：

import DOMPurify from 'dompurify';

function removeHTMLTags(str) {
  return DOMPurify.sanitize(str, { ALLOWED_TAGS: [] });
}

可以通过修改 ALLOWED_TAGS 数组来指定要保留的标签。在上述示例中，我们将其设置为空数组，因此所有标签都会被删除。

示例用法：

const htmlString = '<h1>Hello, <span>World!</span></h1>';
const textString = removeHTMLTags(htmlString);
console.log(textString);  // 输出: "Hello, World!"

以上是几种删除 JavaScript 中 HTML 标签的常见方法。根据你的需求和情况，选择适合你的方法即可。