码农教程 - 一技在手,衣食无忧! tools

目录

HTML DOM 元素 innerText

❮上一节 ❮ 元素对象参考 下一节❯

示例

获取元素的内部文本：

let text = element.innerText;
亲自试一试 »

下面有更多示例。

描述

这个innerText属性设置或返回元素的文本内容。

笔记

当你放innerText 属性时，所有子节点都将被删除，并仅替换为一个新的文本节点。

也可以看看：

textContent 属性

innerHTML 属性

之间的差异
innerHTML、innerText 和 textContent

见下文

语法

返回元素或节点的文本内容：

element.innerText
node.innerText

设置元素或节点的文本内容：

element.innerText = text
node.innerText = text

适当的值

属性 描述
文本 元素的文本内容。

返回值

类型 描述
字符串 元素及其所有后代的文本内容，<script> 和 <style> 元素除外。

之间的差异
innerHTML、innerText 和 textContent

innerHTML 属性返回：
元素的文本内容，包括所有间距和内部 HTML 标记。
innerText 属性返回：
仅元素及其所有子元素的文本内容，没有 CSS 隐藏文本间距和标签，<script> 和 <style> 元素除外。
textContent 属性返回：
元素及其所有后代的文本内容，带有间距和 CSS 隐藏文本，但没有标签。

HTML 示例

<p id="myP">   This element has extra spacing     and contains <span>a span element</span>.</p>

JavaScript 示例

let text = document.getElementById("myP").innerText;

let text = document.getElementById("myP").innerHTML;

let text = document.getElementById("demo").textContent;
亲自试一试 »

在上面的例子中：

innerText 属性返回：
该元素具有额外的间距并包含一个 span 元素。
innerHTML 属性返回：
该元素具有额外的间距并包含<span>一个span元素</span>。
textContent 属性返回：
该元素具有额外的间距并包含一个 span 元素。

浏览器支持

element.innerText所有浏览器都支持：

Chrome IE Edge Firefox Safari Opera
Yes 10-11 Yes Yes Yes Yes
❮上一节 ❮ 元素对象参考 下一节❯