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

</div> 
<a 
href="javascript:alert(test.innerHTML)">innerHTML内容</a> 
<a 
href="javascript:alert(test.innerText)">inerHTML内容</a>

共同点:innerHTML和innerText都会把元素内内容替换掉。
不同点:
1,innerHTML: 
  也就是从对象的起始位置到终止位置的全部内容,包括Html标签。

  上例中的test.innerHTML的值也就是“<span style="color:red">test1</span> 
test2 ”。 
2,innerText: 
  从起始位置到终止位置的内容, 但它去除Html标签

  上例中的text.innerTest的值也就是“test1 test2”, 其中span标签去除了。

值得注意的是,innerHTML是符合W3C标准的属性,而innerText只适用于IE浏览器,因此,尽可能地去使用innerHTML,而少用innerText,如果要输出不含HTML标签的内容,可以使用innerHTML取得包含HTML标签的内容后,再用正则表达式去除HTML标签。

innerHTML和innerText区分的更多相关文章

  1. innerHTML和innerText怎么区分

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

  2. innerHTML与innerText的异同

    在一道面试题中看到的. 1.功能讲解: innerHTML 设置或获取位于对象起始和结束标签内的 HTML outerHTML 设置或获取对象及其内容的 HTML 形式 innerText 设置或获取 ...

  3. JS中innerHTML,innerText,value

    一·.JS初学者易混淆的问题:innerHTML,innerText,value(他们和JQ的区别:JS→value,JQ→value()) 1.getElementById("a" ...

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

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

  5. JS中innerHTML 和innerText和value的区别

    (1)innerHTML 和innerText和value的区别: innerHTML innerText是对非表单元素进行操作的. value是对表单元素进行操作的. (2)innerHTML 和i ...

  6. (转)JS中innerHTML,innerText,value

    原文:http://holysonll.blog.163.com/blog/static/21413909320134111054352/ JS中innerHTML,innerText,value 2 ...

  7. (转)innerHTML、innerText和outerHTML、outerText的区别

    原文:http://walsh.iteye.com/blog/261966 innerHTML.innerText和outerHTML.outerText的区别          博客分类: CSS/ ...

  8. innerHTML与innerText的PK

    一.innerText属性用来定义对象所要输出的文本,在本例中innerText把对象it中的文本"您喜欢看微微一笑很倾城吗?"变成了"超级喜欢!"(语句it. ...

  9. innerHTML和innerText

    document 对象中有innerHTML和innerText 两个属性, 这两个属性都是获取document对象的文本内容的,这两个属性间有哪些区别呢?通过几个例子来看一下. 示例1 <ht ...

随机推荐

  1. 什么是C++虚函数、虚函数的作用和使用方法

    我们知道,在同一类中是不能定义两个名字相同.参数个数和类型都相同的函数的,否则就是“重复定义”.但是在类的继承层次结构中,在不同的层次中可以出现名字相同.参数个数和类型都相同而功能不同的函数.例如在例 ...

  2. Ubuntu 12.04 安装配置 Apache2

    Apache2安装 1 我们使用root账户进行安装,首先切换到root账户,输入命令: sudo su 2 安装 Apache2 apt-get install apache2 在浏览器输入你服务器 ...

  3. 访问者模式讨论篇:java的动态绑定与双分派

    java的动态绑定 所谓的动态绑定就是指程执行期间(而不是在编译期间)判断所引用对象的实际类型,根据其实际的类型调用其相应的方法.java继承体系中的覆盖就是动态绑定的,看一下如下的代码: class ...

  4. Divide Two Integers leetcode java

    题目: Divide two integers without using multiplication, division and mod operator. 题解: 这道题我自己没想出来...乘除 ...

  5. 亚马逊AWS免费套餐EC2安装centos连接登录并创建root

    前言:刚开始使用亚马逊的AWS的免费套餐EC2,由于个人习惯使用centos系统,所以果断安装,但是AWS为了安全性,默认禁止用户使用root账户,导致安装配置环境各种问题.所以我把从安好系统后遇到的 ...

  6. 几行JavaScript代码搞定Iframe 自动适应

    场景:Iframe嵌入flash,希望flash能随着页面的resize而resize. 主要代码: 代码 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTM ...

  7. vue-router路由知识补充

    1.render函数 var app = new Vue({ el: '#app', router, render: h => h(App) //新添加的函数操作 }) 我们新加了render: ...

  8. TextBox_TextChanged

    private void TextBox_TextChanged(object sender, TextChangedEventArgs e) { TextBox textBox = sender a ...

  9. yeoman-angular-gulp

    1.安装 yeoman npm install -g yo gulp bower 2.安装genarate-angular //npm install generator-angular npm in ...

  10. Memcached和Memcache 配置教程windows X64

    一.Memcached和Memcache的区别: 网上关于Memcached和Memcache的区别的理解众说纷纭,我个人的理解是: Memcached是一个内存缓存系统,而Memcache是php的 ...