innerHTML属性,outerHTML属性,textContent属性,innerText属性区别详解


Posted in Javascript onMarch 13, 2015

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

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

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

innerText属性和outerText属性在读取元素节点的文本内容时,得到的值是不一样的。它们的不同之处在于设置一个节点的文本属性时,outerText属性会使得原来的元素节点被文本节点替换掉。注意,innerText是非标准属性,Firefox不支持。

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

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

3.innerText属性不是DOM标准的一部分,Firefox浏览器甚至没有部署这个属性,而textcontent是DOM标准的一部分。

以上就是本文的全部内容了,希望对大家学习熟悉javascript能有所帮助。

Javascript 相关文章推荐
用js实现预览待上传的本地图片
Mar 15 Javascript
Jquery ajax不能解析json对象,报Invalid JSON错误的原因和解决方法
Mar 27 Javascript
简单的前端js+ajax 购物车框架(入门篇)
Oct 29 Javascript
jQuery中json对象的复制方式介绍(数组及对象)
Jun 08 Javascript
jQuery 设置 CSS 属性示例介绍
Jan 16 Javascript
用js将内容复制到剪贴板兼容浏览器
Mar 18 Javascript
Javascript学习笔记之 函数篇(二) : this 的工作机制
Jun 24 Javascript
JavaScript中setUTCMilliseconds()方法的使用详解
Jun 12 Javascript
JQuery标签页效果实例详解
Dec 24 Javascript
JS实现获取当前URL和来源URL的方法
Aug 24 Javascript
JS简单测试循环运行时间的方法
Sep 04 Javascript
Angularjs自定义指令Directive详解
May 27 Javascript
JavaScript内存管理介绍
Mar 13 #Javascript
JavaScript中的this关键字使用方法总结
Mar 13 #Javascript
javascript中slice(),splice(),split(),substring(),substr()使用方法
Mar 13 #Javascript
在linux中使用包管理器安装node.js
Mar 13 #Javascript
JQuery中serialize() 序列化
Mar 13 #Javascript
JavaScript中通过prototype属性共享属性和方法的技巧实例
Mar 13 #Javascript
JQuery中$.each 和$(selector).each()的区别详解
Mar 13 #Javascript
You might like
Linux下进行MYSQL编程时插入中文乱码的解决方案
2007/03/15 PHP
ThinkPHP3.1新特性之对分组支持的改进与完善概述
2014/06/19 PHP
ThinkPHP类似AOP思想的参数验证的实现方法
2019/12/18 PHP
php设计模式之备忘模式分析【星际争霸游戏案例】
2020/03/24 PHP
设置下载不需要倒计时cookie(倒计时代码)
2008/11/19 Javascript
JavaScript去掉空格的方法集合
2010/12/28 Javascript
jquery判断浏览器类型的代码
2012/11/05 Javascript
JavaScript实现网页加载进度条代码超简单
2015/09/21 Javascript
jQuery实现页面顶部下拉广告
2016/12/30 Javascript
jQuery实现导航回弹效果
2017/02/27 Javascript
微信小程序 使用腾讯地图SDK详解及实现步骤
2017/02/28 Javascript
JavaScript实现无刷新上传预览图片功能
2017/08/02 Javascript
zTree节点文字过多的处理方法
2017/11/24 Javascript
jQuery实现的手动拖动控制进度条效果示例【测试可用】
2018/04/18 jQuery
element-ui的回调函数Events的用法详解
2018/10/16 Javascript
微信小程序实现蓝牙打印
2019/09/23 Javascript
谈谈IntersectionObserver懒加载的具体使用
2019/10/15 Javascript
vue点击按钮实现简单页面的切换
2020/09/08 Javascript
[01:53]2016完美“圣”典风云人物:Maybe专访
2016/12/05 DOTA
Python过滤列表用法实例分析
2016/04/29 Python
python根据多个文件名批量查找文件
2019/08/13 Python
python基于socket实现的UDP及TCP通讯功能示例
2019/11/01 Python
Python实现屏幕录制功能的代码
2020/03/02 Python
Python实现粒子群算法的示例
2021/02/14 Python
用CSS3来实现社交分享按钮
2014/11/11 HTML / CSS
Notino芬兰:购买香水和化妆品
2019/04/15 全球购物
中国领先的汽车保养服务平台:途虎养车
2019/10/18 全球购物
简单说说tomcat的配置
2013/05/28 面试题
J2EE面试题大全
2016/08/06 面试题
高中生校园生活自我评价
2013/09/19 职场文书
技术经理的自我评价范文
2013/12/03 职场文书
家长意见和建议怎么写
2015/06/04 职场文书
2016年猴年新春致辞
2015/08/01 职场文书
2015团员个人年度总结
2015/11/24 职场文书
Windows10下安装MySQL8
2021/04/06 MySQL
铁头也玩根德 YachtBoy YB-230......
2022/04/05 无线电