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能有所帮助。

innerHTML属性,outerHTML属性,textContent属性,innerText属性区别详解的更多相关文章

  1. textContent和innerText属性的区别

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

  2. 第7.26节 Python中的@property装饰器定义属性访问方法getter、setter、deleter 详解

    第7.26节 Python中的@property装饰器定义属性访问方法getter.setter.deleter 详解 一.    引言 Python中的装饰器在前面接触过,老猿还没有深入展开介绍装饰 ...

  3. JS之innerHTML,innerText,outerHTML,textContent的用法与区别

    示例html代码: <div id="test"> <span style="color:red">test1</span> ...

  4. 自定义控件的自定义的属性attrs.xml下的declare-styleable中format详解

    最近在摸索自定义控件,查找到一些自定义属性的一些资料,解决转载记载下来:看了此详解才方便理解! 我们在做项目的时候,由于android自带的属性不能满足需求,android提供了自定义属性的方法,其中 ...

  5. android:layout_alignleft layout_toleftof区别,详解RelativeLayout布局属性

    转载请注明博客地址. 最近看博客看到有关于RelativeLayout布局的解释,有的解释很多是错误的.因此有必要对每一个常见的布局属性进行描述.以下解释全部都是逐行进行测试的. 首先把常用的布局分组 ...

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

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

  7. asp.net中C#对象与方法 属性详解

    C#对象与方法 一.相关概念: 1.对象:现实世界中的实体 2. 类:具有相似属性和方法的对象的集合 3.面向对象程序设计的特点:封装  继承 多态 二.类的定义与语法 1.定义类: 修饰符 类名称 ...

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

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

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

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

随机推荐

  1. tomcat 禁用access.log

    修改 server.xml 注释掉,如: <!-- Access log processes all example. Documentation at: /docs/config/valve. ...

  2. java发送email(含代理方式,ssl方式,传统方式)

    package spring.vhostall.com; import java.security.Security; import java.util.Date; import java.util. ...

  3. python之函数用法divmod

    # -*- coding: utf-8 -*- #python 27 #xiaodeng #python之函数用法divmod #http://python.jobbole.com/81480/ #d ...

  4. LEGO机器人发展史

    1998,cybermaster 1999,RCX 1999,micro scout 2000,scout 2002,spybotics NXT NXT2 EV3

  5. 【laravel5.4】vue分页删除

    1.a标签执行ajax删除,后台删除成功后,执行vue分页对象删除对应数据 VUE.js

  6. eclipse里没有project facets

    我下载的eclipse版本问题,导入maven工程可以显示Dynamic web Module. 新建maven工程之后,点击工程属性里没有project facets,从而没有配置Dynamic w ...

  7. PHP 多个mysql连接的问题

    今天在同一个php进程中用mysql_connect新建了两个mysql句柄,这两个句柄都连接同一台数据库,只不过操作的数据库dbname不同,假设这两个句柄分别是$dbhA和$dbhB,它们对应的数 ...

  8. HDUOJ----1250 Hat's Fibonacci

    Hat's Fibonacci Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)T ...

  9. Hibernate 、 Axis2发布

    1. you just compile your web-service into aar file (not include bean files), copy the aar into axis2 ...

  10. 面向对象程序设计(OOP设计模式)-行为型模式之观察者模式的应用与实现

    课程名称:程序设计方法学 实验5:OOP设计模式-行为型模式的应用与实现 时间:2015年12月02日三,第3.4节地点:理 一.实验目的 加深对行为型设计模式的理解以及在开发中的实际应用能力. 二. ...