textContent、innerText和innerHTML都是用来访问和设置元素内容的属性

lewis 1年前 (2024-03-15) 阅读数 4 #技术

textContent、innerText和innerHTML都是用来访问和设置元素内容的属性。

例子：

letelement=document.getElementById("example");
console.log(element.textContent);//获取元素的文本内容
element.textContent="这是新的文本内容";//设置元素的文本内容

innerText：innerText返回元素的可见文本内容，不包括隐藏的元素和样式的文本。可以用来获取或设置一个元素的可见文本内容。

例子：

letelement=document.getElementById("example");
console.log(element.innerText);//获取元素的可见文本内容
element.innerText="这是新的可见文本内容";//设置元素的可见文本内容

innerHTML：innerHTML返回元素的所有HTML内容，包括标签和文本。可以用来获取或设置一个元素的HTML内容。

例子：

letelement=document.getElementById("example");
console.log(element.innerHTML);//获取元素的HTML内容
element.innerHTML="<p>这是新的HTML内容</p>";//设置元素的HTML内容

总结：textContent用于获取和设置元素的文本内容，innerText用于获取和设置元素的可见文本内容，innerHTML用于获取和设置元素的HTML内容。根据需要选择合适的属性来操作元素内容。

本文仅代表作者观点，不代表博信信息网立场。