Sanitizer: removeElement() 方法

可用性有限

此特性不是基线特性，因为它在一些最广泛使用的浏览器中不起作用。

实验性： 这是一项实验性技术
在生产中使用此技术之前，请仔细检查浏览器兼容性表格。

Sanitizer 接口的 removeElement() 方法会将一个元素设置为不允许 — 在 sanitizer 使用时，该元素将从输入中移除。

指定的元素被添加到此 sanitizer 配置的 removeElements 列表。如果元素存在于 elements 或 replaceWithChildrenElements 列表中，它将被移除。

语法

removeElement(element)

参数

element

一个表示要禁止的元素名称的字符串，或者一个具有以下属性的对象

name: 一个包含元素名称的字符串。
namespace 可选: 一个包含元素命名空间的字符串。默认命名空间为 "http://www.w3.org/1999/xhtml"。

返回值

无 (undefined)。

示例

如何禁止元素

此示例展示了如何使用 removeElement() 来指定要“禁止”的元素。

<pre id="log"></pre>

#log {
  height: 420px;
  overflow: scroll;
  padding: 0.5rem;
  border: 1px solid black;
}

const logElement = document.querySelector("#log");
function log(text) {
  logElement.textContent = text;
}

JavaScript

代码首先创建一个新的 Sanitizer 对象，该对象最初允许 <div> 和 <script> 元素，并将 <span> 元素替换为其子元素。

然后，代码调用 removeElement() 将 <p>、<script> 和 <span> 元素添加到配置的 removeElements 列表中。请注意，添加 <script> 和 <span> 会将这些元素从其原始列表中移除。

if ("Sanitizer" in window) {

// Create sanitizer using SanitizerConfig
const sanitizer = new Sanitizer({
  elements: ["div", "script"],
  replaceWithChildrenElements: ["span"],
});

// Disallow the <p> element
sanitizer.removeElement("p");

// Disallow the <script> element
sanitizer.removeElement("script");
// Disallow the <span> element
sanitizer.removeElement("span");

// Log the sanitizer configuration
let sanitizerConfig = sanitizer.get();
log(JSON.stringify(sanitizerConfig, null, 2));

} else {
  log("The HTML Sanitizer API is NOT supported in this browser.");
}

注意：此配置仅为演示目的提供。Sanitizer 配置应仅包含允许的元素（elements）或仅包含不允许的元素（removeElements），但不能两者都包含。在此示例中，只允许 <div> 元素，所有其他元素都将被从输入中移除：因此，被移除的元素没有效果。

结果

最终配置将在下方日志中显示。

规范

规范
HTML Sanitizer API # dom-sanitizer-removeelement

浏览器兼容性

帮助改进 MDN

了解如何贡献

此页面最后修改于 2025年6月26日，由 MDN 贡献者编辑。

在 GitHub 上查看此页面 • 报告此内容的问题