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 相关文章推荐
Prototype1.5 rc2版指南最后一篇之Position
Jan 10 Javascript
JavaScript 原型继承
Dec 26 Javascript
轻松实现js图片预览功能
Jan 18 Javascript
JS+CSS实现DIV层的展开、收缩效果
Jan 28 Javascript
JS HTML5实现拖拽移动列表效果
Aug 27 Javascript
Angular 理解module和injector,即依赖注入
Sep 07 Javascript
Js操作DOM元素及获取浏览器高宽的简单方法
Sep 08 Javascript
浅谈js函数三种定义方式 & 四种调用方式 & 调用顺序
Feb 19 Javascript
bootstrap折叠调用collapse()后data-parent不生效的快速解决办法
Feb 23 Javascript
JS处理数据四舍五入(tofixed与round的区别详解)
Oct 26 Javascript
Vue通过ref父子组件拿值方法
Sep 12 Javascript
浅入深出Vue之自动化路由
Aug 06 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
对盗链说再见...
2006/10/09 PHP
基于PHP与XML的PDF文档生成技术
2006/10/09 PHP
PHP学习 变量使用总结
2011/03/24 PHP
ThinkPHP模板判断输出Defined标签用法详解
2014/06/30 PHP
PHP多线程模拟实现秒杀抢单
2018/02/07 PHP
浅谈php使用curl模拟多线程发送请求
2019/03/08 PHP
PHP正则之正向预查与反向预查讲解与实例
2020/04/06 PHP
JavaScript写的一个自定义弹出式对话框代码
2010/01/17 Javascript
javascript 用原型继承来实现对象系统
2010/03/22 Javascript
Asp.net下利用Jquery Ajax实现用户注册检测(验证用户名是否存)
2010/09/12 Javascript
jquery load()在firefox(火狐)下显示不正常的解决方法
2011/04/05 Javascript
关于js日期转化为毫秒数“节省20%的效率和和节省9个字符“问题
2012/03/01 Javascript
JQuery验证工具类搜集整理
2013/01/16 Javascript
JavaScript中的this机制
2016/01/30 Javascript
JavaScript Promise 用法
2016/06/14 Javascript
ReactJs快速入门教程(精华版)
2016/11/28 Javascript
Bootstrap3 多选和单选框(checkbox)
2016/12/29 Javascript
jQuery复合事件结合toggle()方法的用法示例
2017/06/10 jQuery
vue 实现 rem 布局或vw 布局的方法
2019/11/13 Javascript
ES6常用小技巧总结【去重、交换、合并、反转、迭代、计算等】
2019/12/21 Javascript
使用vue实现HTML页面生成图片的方法
2020/03/12 Javascript
Python玩转PDF的各种骚操作
2019/05/06 Python
如何用Python制作微信好友个性签名词云图
2019/06/28 Python
Python学习笔记之Break和Continue用法分析
2019/08/14 Python
Python:合并两个numpy矩阵的实现
2019/12/02 Python
python 实现dict转json并保存文件
2019/12/05 Python
flask的orm框架SQLAlchemy查询实现解析
2019/12/12 Python
Pytorch框架实现mnist手写库识别(与tensorflow对比)
2020/07/20 Python
现代家居用品及礼品:LBC Modern
2018/06/24 全球购物
飞利浦西班牙官方网站:Philips西班牙
2020/02/17 全球购物
英国Lookfantastic中文网站:护肤品美妆美发购物(英国直邮)
2020/04/27 全球购物
黄河的主人教学反思
2014/02/07 职场文书
《宿建德江》教学反思
2014/04/23 职场文书
2014年幼儿园小班工作总结
2014/12/04 职场文书
客户付款通知书
2015/04/23 职场文书
2016中秋节晚会开场白
2015/11/26 职场文书