<div id="test">

   <span style="color:red">test1</span> test2

</div>

在JS中可以使用:

1. test.innerHTML:

  也就是从对象的起始位置到终止位置的全部内容,包括Html标签。

  上例中的test.innerHTML的值也就是“<span style="color:red">test1</span> test2 ”。

2. test.innerText:

  从起始位置到终止位置的内容, 但它去除Html标签

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

3. test.outerHTML:

  除了包含innerHTML的全部内容外, 还包含对象标签本身。

  上例中的text.outerHTML的值也就是<div id="test"><span style="color:red">test1</span> test2</div>

 特别说明:

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

4. test.innerHTML和test.html()的区别

innerHTML是js的原生写法,html()是jquery的写法,

test.innerHTML="<span>Hello</span>";//重新设置test内的html代码。

 $("#test").html("<span>Hello</span>");//重新设置test内的html代码。

ps:最重要的一点是原生js永远比jq快

js中innerHTML和innerText的用法的更多相关文章

  1. js中innerHTML与innerText的用法与区别

    用法: <div id="test">    <span style="color:red">test1</span> te ...

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

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

  3. JS中innerHTML,innerText,value

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

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

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

  5. JS中innerHTML和innerText,outerHTML和outerText

      innerHTML 声明了元素含有的HTML文本,不包括元素本身的开始标记和结束标记 innerHTML是符合W3C标准的属性,而innerText只适用于IE浏览器(现在也适应chrome浏览器 ...

  6. js中innerHTML、outerHTML与innerText的用法与区别

    ____________________________________________________________________________________________________ ...

  7. JS中innerHTML、outerHTML、innerText 、outerText、value的区别与联系?jQuery中的text()、html()和val()

    一.JS中innerHTML.outerHTML.innerText .outerText.value的区别与联系?jS中设置或者获取所选内容的值:①innerHTML :属性设置或返回该标签内的HT ...

  8. js中substring和substr的用法

    js中substring和substr的用法 substring 方法用于提取字符串中介于两个指定下标之间的字符 substring(start,end) 开始和结束的位置,从零开始的索引 参数    ...

  9. 第22篇 js中的this指针的用法

    前面把js的相关知识总结了下,今天把js中的上下文的this,对于强类型语言,this的用法非常的单一,因为他们没有js特有的动态绑定. 首先看下面代码: function funcA() { thi ...

随机推荐

  1. 为autoLayout 增加标识符,方便调试

     如上图,是一个十分简单的布局. root view 上加了一个 button 和一个 webview. 不加标识符的样子 视图层级中没有标识  只有 UIView.WKWebView 之类,如果 ...

  2. 归并排序的理解和实现(Java)

    归并排序介绍 归并排序(Merge Sort)就是利用归并的思想实现的排序方法.它的原理是假设初始序列含有fn个记录,则可以看成是n个有序的子序列,每个子序列的长度为1,然后两两归并,得到[n2\fr ...

  3. Python中第三方库的安装

    网上的帖子挺多的,教你如何安装,安装第三方工具库的方法总共分为三类:Dos系统下pip命令:安装包下载安装:IDE集成环境下安装(Pycharm,Spyder……) http://www.jiansh ...

  4. Window Location对象

    window.location 对象用于获得当前页面的地址 (URL),并把浏览器重定向到新的页面. window.location 对象在编写时可不使用 window 这个前缀. Location ...

  5. Zabbix3.2邮件告警python脚本

    一.概述及环境要求 1.概述 zabbix监控也起到重要作用,以下是使用python脚本发送告警邮件配置方法.之前使用过sendemail邮件报警但是发现邮件主题为中文时候会出现乱码的问题. 2.环境 ...

  6. 有关Hadoop的六大误解

    迄今为止,Hadoop和大数据实际上是同义词.然而随着大数据的炒作不断升温,出现了很多对Hadoop如何应用于大数据的误解. Hadoop是一种用于存储和分析大型数据集开源软件框架,可处理分布在多个现 ...

  7. 【Ubuntu】使用记录

    Vim 设置自动折行 :set wrap Maven 安装 去官网下载maven安装包 解压maven, 在主目录下的.bashrc中添加 export PATH="$PATH:{your_ ...

  8. 搭建互联网架构学习--003--maven以及nexus私服搭建

    跳过,等待完善中,,, 后台服务工具maven:使用Nexus配置Maven私有仓库 一.安装配置Nexus 1. 下载nexus https://www.sonatype.com/download- ...

  9. thymeleaf的常见问题汇总

    thymeleaf的常见问题汇总 1.thymeleaf th:href 多个参数传递格式 th:href="@{/Controller/update(param1=1,param2=${p ...

  10. python3 连接HBase

    db_url = 'http://47.93.89.99:8765' from traceback import format_exc import phoenixdb as pb class Uti ...