例:

  <div id="study">
    <span style="color:red">学习</span>study
  </div>

在JS中:

innHTML:可以获取标签(获取元素内部的内容),也可以解析标签

在上例中,也就是说study.innerHTML的值也就是“<span style="color:red">学习</span> study ”。

innerText:只获取文本,设置时,全部当作文本,不能解析标签

在上例中,也就是说study.innerText的值也就是“学习 study”

outerHTML: 可以获取到最外层的标签和标签里内容(获取标签时包括自己)

在上例中,值就是:<div id="study"><span style="color:red">学习</span>study</div>

注:它们虽然功能强大,但有一定的兼容性。

innerHTML与innerText功能的强大的更多相关文章

  1. innerHTML与innerText的异同

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

  2. innerHTML与innerText的PK

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

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

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

  4. 推荐一个简单、轻量、功能非常强大的C#/ASP.NET定时任务执行管理器组件–FluentScheduler定时器

    在C#WINFORM或者是ASP.NET的WEB应用程序中,根据各种定时任务的需求,比如:每天的数据统计,每小时刷新系统缓存等等,这个时候我们得应用到定时器这个东东. .NET Framework有自 ...

  5. JS中innerHTML,innerText,value

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

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

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

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

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

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

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

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

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

随机推荐

  1. vuex的学习例子

    最近在学习vuejs,一直有听说vuex,用来实现多组件共享的一种状态管理模式,但是网上都说,不要为了用vuex而用vuex,大概意思就是尽量少用vuex,一些小项目可以用bus来实现组件之间的传值问 ...

  2. Linux下使用timedatectl命令时间时区操作详解

    timedatectl命令对于RHEL / CentOS 7和基于Fedora 21+的分布式系统来说,是一个新工具,它作为systemd系统和服务管理器的一部分,代替旧的传统的用在基于Linux分布 ...

  3. php 图片添加水印和二维码

    $host = $_SERVER['HTTP_HOST']; $save_code_file = './qrcodes/qrcode.png'; QrCode::format()->backgr ...

  4. es6新增的math函数有哪些

    Math.trunc():用于去除一个数的小数部分,返回整数部分. Math.sign():用来判断一个数到底是正数.负数.还是零. Math.cbrt():用于计算一个数的立方根. Math.hyp ...

  5. day20-正则表达式练习

    import re from re import findall,search,S secret_code = 'hadkfalifexxIxxfasdjifja134xxlovexx23345sdf ...

  6. OOP⑹

    1.抽象类 所有由abstract关键字修饰的方法我们称之为 抽象方法! 抽象方法只能存在于 抽象类中! 所有由abstract关键字修饰的类我们称之为 抽象类! 抽象类的特点: 01.由abstra ...

  7. what’s this?

    jdk,jre,jvm三者区别:JDK: (Java Development ToolKit) java开发工具包.JDK是整个java的核心! 包括了java运行环境 JRE(Java Runtim ...

  8. c#7的新特性

    1.out关键字 //可以直接声明使用 ",out int number); 2.元组 //有点类似匿名对象的样子 //用小括号包含变量,可以当做返回值,可以当做变量赋值等 //1.当做函数 ...

  9. 最短路径:Dijkstra & Floyd 算法图解,c++描述

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  10. 2017 秦皇岛CCPC Balloon Robot (ZOJ 3981)

    题意:给出n个队伍,m个座位,q次A题的队伍与时间,下一行是n个队伍的坐的位置,再下面q行就是第x个队再第y秒A出一道题,然后有一个机器人,开始位置由你选,他每走一步 他就会向右走一格,走到m的时候会 ...