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 上檢視此頁面 • 報告此內容的問題