HTMLElement：innerText 屬性
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since 2016年3月.
HTMLElement 介面的 innerText 屬性表示一個節點及其後代的算繪文字內容。
作為 getter，它近似於使用者用游標選取該元素內容並複製到剪貼簿時會取得的文字。
作為 setter，這會將元素的子元素替換為給定的值，並將所有換行轉換為 <br> 元素。
備註：innerText 容易與 Node.textContent 混淆，但兩者之間有重要的差異。基本上，innerText 會感知文字的算繪外觀，而 textContent 則不會。
值
一個表示元素算繪文字內容的字串。
如果元素本身未被算繪（例如：已從文件中分離或被隱藏），回傳值將與 Node.textContent 屬性相同。
警告：在節點上設定 innerText 會移除該節點的所有子元素，並將它們替換為具有給定字串值的單一文字節點。
範例
此範例比較 innerText 與 Node.textContent。
注意 innerText 如何感知 <br> 等元素，並忽略隱藏的元素。
HTML
html
<h3>原始元素：</h3>
<p id="source">
<style>
#source {
color: red;
}
#text {
text-transform: uppercase;
}
</style>
<span id="text">
看一看<br />
這段文字<br />
在下方如何被解讀。
</span>
<span style="display:none">隱藏文字</span>
</p>
<h3>textContent 的結果：</h3>
<textarea id="textContentOutput" rows="18" cols="40" readonly>…</textarea>
<h3>innerText 的結果：</h3>
<textarea id="innerTextOutput" rows="6" cols="40" readonly>…</textarea>
JavaScript
js
const source = document.getElementById("source");
const textContentOutput = document.getElementById("textContentOutput");
const innerTextOutput = document.getElementById("innerTextOutput");
textContentOutput.value = source.textContent;
innerTextOutput.value = source.innerText;
結果
規範
| Specification |
|---|
| HTML # the-innertext-idl-attribute |