HTML DOM textContent 属性
textContent属性设置或返回指定节点及其所有子节点的文本内容。
在节点上设置textContent将删除节点的所有子节点,并将其替换为具有给定文本的单个文本节点。
textContent属性类似于innerText属性,但是有一些区别:textContent返回所有元素的文本内容,而innerText则是返回除
innerText不会返回隐藏在CSS中的元素的文本(textContent会返回)
要设置或返回元素的HTML内容,请使用innerHTML属性。
语法:
返回节点的文本内容:node.textContent
设置节点的文本内容:node.textContent = text
示例var x = document.getElementById("para").textContent;测试看看‹/›
浏览器兼容性
所有浏览器完全支持textContent属性:属性
textContent是是是是是
属性值值描述
text指定指定节点的文本内容
技术细节返回值:一个字符串,表示节点及其所有子节点的文本。如果元素是文档,文档类型或符号,则返回null
DOM版本:DOM级别3
更多实例
用id="para"更改
元素的文本内容:
示例var x = document.getElementById("para");
x.textContent = "HELLO WORLD";测试看看‹/›
返回DIV元素的所有文本内容:
示例var x = document.getElementById("container").textContent;测试看看‹/›
此示例演示了innerText,innerHTML和textContent之间的区别:
示例
此元素有额外的间距,并且包含一个span 元素.
function getInnerText() {
alert(document.getElementById("x").innerText);
}
function getInnerHTML() {
alert(document.getElementById("x").innerHTML);
}
function getTextContent() {
alert(document.getElementById("x").textContent);
}
测试看看‹/›
innerText属性仅返回文本,不包含空格和内部元素标签。
innerHTML属性返回带有空格和内部元素标签的文本。
textContent属性返回带间距的文本,但不带内部元素标签。
相关参考