HTMLElement: outerText 屬性

Baseline 已廣泛支援

此特性已經十分成熟，可在許多裝置和瀏覽器版本上使用。自 2022 年 3 月起，它已在各瀏覽器中可用。

HTMLElement 介面的 outerText 屬性返回的值與 HTMLElement.innerText 相同。作為 setter 使用時，它會用給定的文字替換整個當前節點（這與 innerText 不同，後者替換的是當前節點內部的內容）。

有關更多資訊以及演示 getter 用法和示例，請參閱 HTMLElement.innerText。

值

一個表示元素及其後代的可渲染文字內容的字串。

如果元素本身沒有被渲染（例如，它已從文件中分離或對檢視隱藏），則返回的值與 Node.textContent 屬性相同。

作為 setter 使用時，它會用給定的文字替換當前節點，並將任何換行符轉換為 <br> 元素。

此示例強調了 outerText 和 innerText 作為 setter 使用時的根本區別（作為 getter 使用時它們是相同的）。

注意： 此示例是 What is the difference between innerText and outerText?（Stack overflow）的修改版本，由 codingintrigue 提供，並根據 CC BY-SA 3.0 許可。

考慮一個包含以下 HTML 的頁面

html

<div>
  <p>Original content</p>
</div>

outerText 會替換整個選定的元素，因此 JavaScript 語句 p.outerText = "Whole element replaced" 會替換整個選定的 p 元素。

html

<div>Whole element replaced</div>

相比之下，p.innerText = "Content inside element replaced" 會替換選定 p 元素內部的內容。

html

<div>
  <p>Content inside element replaced</p>
</div>

規範
HTML # dom-outertext

此頁面最後修改於 2024 年 7 月 26 日，由 MDN 貢獻者修改。