textContent 与innerText
转自下面这位大神：
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去除所有标签后的内容
会将<这些进行换码，直接剔除html的语义化标签
会保留多个空格
不会将<br />进行转换
第三：对应script标签里面的内容
innerText不能返回
textContent可以
textContent 与innerText的更多相关文章
- textContent、innerText的用法，在文档中插入纯文本
有时候需要查询纯文本形式的元素内容,或者在文档中插入纯文本.标准的方法是用Node的textContent属性来实现: var para = document.getElementsByTagName ...
- textContent、innerText 以及Event事件兼容性问题
今天在完成前端的简单练习时发现了一些兼容性的问题,百度后得以解决. 这里主要讨论Firefox与Chrome的兼容性问题. textContent与 innerText 在javascript中, 为 ...
- textContent和innerText属性的区别
原文摘自 textContent和innerText属性的区别 <!DOCTYPE html> <html> <head> <meta charset=&qu ...
- JS魔法堂：被玩坏的innerHTML、innerText、textContent和value属性
一.前言 由于innerText并非W3C标准属性,因此我们无法在FireFox中使用它(修正:FF45+已经支持innerText属性),一般情况下我们可以使用textContent来代替,但它两者 ...
- innerHTML，innertext ，textcontent，write（）
innerhtml属于对象的一个属性,一般用于向已经存在的标签中写入内容,或者读取标签的内容. innertext属于对象的一个属性,一般只能用于写入内容,或者读取内容,不能读取dom 中的标签,且只 ...
- textContent、innerHTML、innerText、outerText、outerHTML、nodeValue使用场景和区别
今天要讲的这些属性都可以用来获取某个元素的内容,你可能会觉得不可思议,或是说上一句"丧心病狂"也.但当你看完以下内容后,会发现除outerText无用外,其他的都有各自的使用场景, ...
- [转]被玩坏的innerHTML、innerText、textContent和value属性
一.前言 由于innerText并非W3C标准属性,因此我们无法在FireFox中使用它,一般情况下我们可以使用textContent来代替,但它两者是否就能完全等同呢?在坑爹的表单元素(如input ...
- vue-learning：12 - 2 - 区分：outerHTML - innerTHML - outerText - innerText - textContent
区分:outerHTML - innerTHML - outerText - innerText - textContent 获取值 <div id="outer"> ...
- DOM 操作内容 innerText/innerHTML
DOM 操作内容 innerText/innerHTML innerText属性(firefox不支持,可用 textContent)var div = document.getElementById ...
随机推荐
- excel具有制作甘特图的功能
1.Excel最大功能:数据处理.统计分析. 2.数据有效性验证: 长数字输入方法,文本前面加英文"'"(单引号)或使用文本转换. 身份证号:数据.数据有效性.文本长度. 性别:数 ...
- C#中this在扩展方法的应用
给类添加扩展方法 1.定义一个类Service public class Service { private string _name; public string Name { get { retu ...
- BZOJ 3110 树套树 && 永久化标记
感觉树套树是个非常高深的数据结构.从来没写过 #include <iostream> #include <cstdio> #include <algorithm> ...
- Python::OS 模块 -- 进程参数
os模块的简介请参看 Python::OS 模块 -- 简介 os模块的文件和目录操作 Python::OS 模块 -- 文件和目录操作 os模块的进程管理 Python::OS 模块 -- 进程管理 ...
- iwork 09 可以用的序列号
E4RJ-YKHP-9ER4-WK9Y-H4UM-5S2G9MU-9U9J-KN4M-4PAE-DYNA-5S2EGMU-3PKP-NN9G-3JW4-3RAD-5S2
- JS(去掉前后空格或去掉所有空格)的用法 推荐使用jquery 方法
说明: 如果使用jQuery直接使用$.trim(str)方法即可,str表示要去掉前后所有空格的字符串. 推荐 1. 去掉字符串前后所有空格: 代码如下: function Tri ...
- kibana ,logstash and filebeat
https://www.elastic.co/guide/en/kibana/current/install.html https://www.elastic.co/guide/en/logstash ...
- Windows 10 x64 安装 Visual Basic 6.0 SP6
原文是E文,E文好的可以直接看这里:http://www.fortypoundhead.com/showcontent.asp?artid=23993 原则上Windows 7 x64, Window ...
- List remove注意点
public class ListTest { public static void main(String[] args) { // TODO Auto-generated method stub ...
- MSSQL 创建自定义异常
创建时,必须先创建英文的,否则会报错:必须添加此消息的 us_english 版本后,才能添加 '简体中文' 版本. EXEC sp_addmessage 50001, 15, 'option wro ...