<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标签。

innertext与innerhtml的更多相关文章

  1. jQuery中的text()、html()和val()以及innerText、innerHTML和value

    *jQuery中设置或者获取所选内容的值:text();设置或者获取所选元素的文本内容: html();设置或者获取所选元素的内容(包括html标记): val();设置或者获取表单字段的值(前提是表 ...

  2. Js之Dom学习-三种获取页面元素的方式、事件、innerText和innerHTML的异同

    一.三种获取页面元素的方式: getElementById:通过id来获取 <body> <input type="text" value="请输入一个 ...

  3. JavaScript DOM编程基础精华02(window对象的属性,事件中的this,动态创建DOM,innerText和innerHTML)

    window对象的属性1 window.location对象: window.location.href=‘’;//重新导航到新页面,可以取值,也可以赋值. window.location.reloa ...

  4. innerText与innerHTML的区别

    innerText与innerHTML的区别:1.innerText将所有文本内容作为普通的文本2.innerHTML会识别文本内容中是否含有html标签,它能够把html标签的效果显示出来3.inn ...

  5. 从零开始学 Web 之 DOM(三)innerText与innerHTML、自定义属性

    大家好,这里是「 Daotin的梦呓 」从零开始学 Web 系列教程.此文首发于「 Daotin的梦呓 」公众号,欢迎大家订阅关注.在这里我会从 Web 前端零基础开始,一步步学习 Web 相关的知识 ...

  6. javascript总结37:DOM:innerText 和 innerHTML

    innerText 和 innerHTML 作用: 给双标签的元素设置内容/获取双标签里面的内容 不同点: innerText 只是用于获取文本或设置文本 innerHTML 不仅可以用于设置/获取文 ...

  7. jQuery中的text()、html()和val()以及javaScript中的innerText、innerHTML和value

    *jQuery中设置或者获取所选内容的值:text();设置或者获取所选元素的文本内容: html();设置或者获取所选元素的内容(包括html标记): val();设置或者获取表单字段的值(前提是表 ...

  8. JQuery中 text()、html() 以及 val()以及innerText、innerHTML和value

    设置内容 - text().html() 以及 val() 我们将使用前一章中的三个相同的方法来设置内容: text() - 设置或返回所选元素的文本内容 html() - 设置或返回所选元素的内容( ...

  9. jQuery中怎么添加innerText、innerHtml(转)

    发现如果我在div或者其他非表单的标签中赋值,原本用普通的js就直接document.getElementById("id").innerHtml(或者其他几个)就可以了. 但是在 ...

随机推荐

  1. Magento怎么设置和使用Cookie和Session?

    Magento中cookie和session是已经封装了的 Magento的核心对象-Mage_Core_Model_Cookie & Mage_Core_Model_Session Mage ...

  2. VundleVim的安装与使用

    git:https://github.com/VundleVim/Vundle.vim vundle是一款vim编辑器的插件管理软,用起来很方便的原因有几点: 1)只要知道插件名称,就能搜索到并下载安 ...

  3. OpenMP的简单使用教程

    转自:http://binglispace.com/2015/01/09/openmp-intro/ OpenMP的简单使用教程 今天有幸参加了一个XSEDE OpenMP的workshop讲座,真是 ...

  4. JAVA存取PG大对象类型OID数据

    转载地址:http://my.oschina.net/liuyuanyuangogo/blog/151537 pg用大对象存储二进制数据的老文档:http://jdbc.postgresql.org/ ...

  5. Spring-IOC之前世今生

    没使用IOC之前 贯用工厂模式调用 bean组件 可类比为: 去商场买东西,你是先想好自己要买什么了,然后去寻找商品(逛商场的同学不要扯皮啊2333) 用了IOC之后 可类比为: 所有网上购物,所有的 ...

  6. WebRTC录音(1)-实现通话双向录音

    最近公司的iPad项目中一个功能点涉及到了VOIP通讯中的录音,需要在已有的WebRTC引擎中增加录音功能,录制通话双方的声音参考了往上一位兄弟的博文(链接在此 http://blog.csdn.ne ...

  7. TextView中的图文混排

    ImageSpan imageSpanMenu1 = new ImageSpan(activity,menuResId1); SpannableString contentMenu1 = new Sp ...

  8. eclipse项目导入到android studio

    只需要添加gradle文件,在里面添加如下代码片段------------------------------------------- main { manifest.srcFile 'Androi ...

  9. codeforces magic five --快速幂模

    题目链接:http://codeforces.com/contest/327/problem/C 首先先算出一个周期里面的值,保存在ans里面,就是平常的快速幂模m做法. 然后要计算一个公式,比如有k ...

  10. Objective-c——UI基础开发第八天(QQ聊天界面)

    一.知识点: QQ聊天界面 双模型的使用(dataModel和frameModel) UITextField的使用 通知的使用 拉伸图片的两种方法(slicing/image对象的resizeable ...