<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. 四则运算app工程的进展

    深入分析五个四则运算app: 1.ALM-Addition 缺点:版本是英文版,不利于孩子们弄懂.  用选择题的方法来选择正确的答案,固然有运气答对的成分,不利于统计真实的水平. 优点:有图标统计答题 ...

  2. JS的强大

    JS很强大,对于网页设计者来说,会用JS真的很重要. 学好我的linux,和数据结构.

  3. FHS目录配置下,常见的几个问题及解答

    请说明/bin与/usr/bin目录所放置的执行文件有何不同之处? /bin主要放置在开机时,以及进入单人维护模式后还能够被使用的指令,至于/usr/bin则是大部分软件提供的指令放置处. 请说明/b ...

  4. 快速掌握grep命令及正则表达式

    Linux系统自带了支持拓展正则表达式的 GNU 版本 grep 工具,所有的Linux发行版中均默认安装grep ,grep 命令被用来检索一台服务器或工作站上任何位置的文本信息,如何在 Linux ...

  5. 比较compareTo与equals及==的区别

    1.compareTo: 附上:源码: public int compareTo(String anotherString) {         int len1 = value.length;   ...

  6. hdu3033 I love sneakers! 分组背包变形

    分组背包要求每一组里面只能选一个,这个题目要求每一组里面至少选一个物品. dp[i, j] 表示前 i 组里面在每组至少放进一个物品的情况下,当花费 j 的时候,所得到的的最大价值.这个状态可以由三个 ...

  7. PHP 将json的stdClass Object转成数组array

    PHP和JS通讯通常都用json,但是PHP要用json的数据,通过json_decode转出来的数组并不是标准的array,所以需要用这个函数进行转换. function object_array( ...

  8. poj1680 最短路判环

    题意:有多个银行可以换钱,每个银行可以将特定的两种钱相互兑换,并且有自己的汇率,现在问是否可以将自己的钱通过银行兑换增加. 其实比较水,主要就是知道最短路问题里的负环可以通过bellman-fold或 ...

  9. ExtJS4.2.1自定义主题(theme)样式详解

    (基于Ext JS 4.2.1版本) UI组件 学习ExtJS就是学习组件的使用.ExtJS4对框架进行了重构,其中最重要的就是形成了一个结构及层次分明的组件体系,由这些组件形成了Ext的控件. Ex ...

  10. 黑马程序员——JAVA基础之基本数据类型包装类和1.5JDK新特性装箱

    ------- android培训.java培训.期待与您交流! ---------- 基本数据类型包装类: byte Byte short Short int Integer char Charac ...