转自下面这位大神:

http://zhangyaochun.iteye.com/blog/1391370

其实关于这textContent与innerText有很多碎碎的东西,不过个人觉得还是一个不错的topic,好好讲讲吧。

1、关于兼容性

这个很多人应该都了解:

innerText除了ff3.6外,Chrome Safari Opera均支持

textContent除IE8及以下版本外,IE9 Chrome Safari Opera均支持

2、关于返回值

第一:这个其实也算兼容性里面的一种,主要考虑不同场景下的返回值:

如果容器设置了"visibility:hidden"

在Chrome Safari中获取该容器元素的innerText返回值是“”

在其他均返回的是正常的文本

相反,如果容器visible没有设置,而是默认值visibility

不存在浏览器差异

结论:

在Webkit下,innerText的返回值依赖与元素的visibility的值

第二:对于标签如<br />等的不同处理。

innerText是将元素的innerHTML换码---解释---显示,去除各种格式信息留下的是纯文本。

会将多个空格合并成一个

会将<br />转成换行符

textContent是innerHTML去除所有标签后的内容

会将&lt;这些进行换码,直接剔除html的语义化标签

会保留多个空格

不会将<br />进行转换

第三:对应script标签里面的内容

innerText不能返回

textContent可以

textContent 与innerText的更多相关文章

  1. textContent、innerText的用法,在文档中插入纯文本

    有时候需要查询纯文本形式的元素内容,或者在文档中插入纯文本.标准的方法是用Node的textContent属性来实现: var para = document.getElementsByTagName ...

  2. textContent、innerText 以及Event事件兼容性问题

    今天在完成前端的简单练习时发现了一些兼容性的问题,百度后得以解决. 这里主要讨论Firefox与Chrome的兼容性问题. textContent与 innerText 在javascript中, 为 ...

  3. textContent和innerText属性的区别

    原文摘自 textContent和innerText属性的区别 <!DOCTYPE html> <html> <head> <meta charset=&qu ...

  4. JS魔法堂:被玩坏的innerHTML、innerText、textContent和value属性

    一.前言 由于innerText并非W3C标准属性,因此我们无法在FireFox中使用它(修正:FF45+已经支持innerText属性),一般情况下我们可以使用textContent来代替,但它两者 ...

  5. innerHTML,innertext ,textcontent,write()

    innerhtml属于对象的一个属性,一般用于向已经存在的标签中写入内容,或者读取标签的内容. innertext属于对象的一个属性,一般只能用于写入内容,或者读取内容,不能读取dom 中的标签,且只 ...

  6. textContent、innerHTML、innerText、outerText、outerHTML、nodeValue使用场景和区别

    今天要讲的这些属性都可以用来获取某个元素的内容,你可能会觉得不可思议,或是说上一句"丧心病狂"也.但当你看完以下内容后,会发现除outerText无用外,其他的都有各自的使用场景, ...

  7. [转]被玩坏的innerHTML、innerText、textContent和value属性

    一.前言 由于innerText并非W3C标准属性,因此我们无法在FireFox中使用它,一般情况下我们可以使用textContent来代替,但它两者是否就能完全等同呢?在坑爹的表单元素(如input ...

  8. vue-learning:12 - 2 - 区分:outerHTML - innerTHML - outerText - innerText - textContent

    区分:outerHTML - innerTHML - outerText - innerText - textContent 获取值 <div id="outer"> ...

  9. DOM 操作内容 innerText/innerHTML

    DOM 操作内容 innerText/innerHTML innerText属性(firefox不支持,可用 textContent)var div = document.getElementById ...

随机推荐

  1. HDU 4507 吉哥系列故事——恨7不成妻

    需要推下平方和的式子..维护个数,和,平方和. #include<iostream> #include<cstdio> #include<cstring> #inc ...

  2. javascript之小积累-.-typeof与instanceof的区别

    1.typeof 是获取一个变量或表达式的类型,返回的值通常是string, number, boolean, object(null, 数组, 对象), function, undefined,可以 ...

  3. Caffe 源碼閱讀(二) SyncedMemory.hpp

    1. to_cpu 數據由現存同步到內存 2. to_gpu 數據由內存同步到顯存 3. cpu_str_ 內存指針 4. gpu_str_ 顯存指針 5. size_ 數據大小 6. own_cpu ...

  4. activity 和 生命周期 :流程

    activity是android的一个基本的组件.讨论生命周期,taskstack等等的话题的时候.就不得不去看一下android framework层的源码了. 生命周期,实际就是系统调用andro ...

  5. WCF终结点配置

    错误信息:已有针对 IP 终结点 127.0.0.1:8235 的侦听器.如果有其他应用程序已在侦听此终结点,或者,如果在服务主机中具有多个服务终结点,这些终结点具有相同的 IP 终结点但绑定配置不兼 ...

  6. HTML的总结

    一.Html简介    HTML 是一种标记语言       忽略大小写,语法宽松    使用 HTML 标记和元素,可以:       控制页面和内容的外观       发布联机文档       使 ...

  7. 如何快速编写Vim语法高亮文件

    这里有一份中文的入门文档,但是太长了,不想读,所以有本文 最快的办法,就是找一个语法相近的语法高亮文件,稍微改一下 自己从头写的话,首先搞定关键字: syntax case match "是 ...

  8. CCSprite setTextureRect 的坐标的坑

    setTextureRect显示区域所使用的坐标系是跟cocos2d-x的系统坐标系是有区别的,这个坐标系使用的一般屏幕坐标系,也就是以左上角为原点(0,0). Sprite的AnchorPoint对 ...

  9. HC系列蓝牙模块连接单片机与电脑,传输数据(蓝牙心电测试)

    毕设做无线心电监护.有线的做出来了,AD8232+MCU+LabVIEW上位机.pcb还没时间搞,这个9*7*2.5cm拿来测试能用. 自己做了AD8232的模拟前端,打的板子还没到没法测试. 虽然比 ...

  10. H5版俄罗斯方块(3)---游戏的AI算法

    前言: 算是"long long ago"的事了, 某著名互联网公司在我校举行了一次"lengend code"的比赛, 其中有一题就是"智能俄罗斯方 ...