textContent,innerText、innerHTML和outerHTML区别

快乐打工仔 分类:实例代码

本章节简单介绍一下标题中三个属性的用法和区别,需要的朋友可以做一下参考。

(1).innerHTML属性用来读取或设置某个节点内的HTML代码。

(2).outerHTML属性用来读取或设置HTML代码时,会把节点本身包括在内。

(3).textContent属性用来读取或设置节点包含的文本内容。

主要区别如下:

(1).innerText属性和outerText属性在读取元素节点的文本内容时,得到的值是不一样的。

(2).它们的不同之处在于设置一个节点的文本属性时,outerText属性会使得原来的元素节点被文本节点替换掉。

(3).innerText受CSS影响,textcontent没有这个问题。比如,如果CSS规则隐藏了某段文本,innerText就不会返回这段文本,textcontent则照样返回。

(4).innerText返回的文本,会过滤掉空格、换行和回车键,textcontent则不会。

特别说明:innerText是非标准属性,Firefox不支持。

textContent,innerText、innerHTML和outerHTML区别,这样的场景在实际项目中还是用的比较多的,关于textContent,innerText、innerHTML和outerHTML区别就介绍到这了。

textContent,innerText、innerHTML和outerHTML区别属于前端实例代码,有关更多实例代码大家可以查看

一线大厂高级前端编写,前端初中阶面试题,帮助初学者应聘,需要联系微信:javadudu

回复

我来回复
  • 暂无回复内容