innerHTML和innerText怎么区分
示例代码:
<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都会把元素内内容替换掉。 区别在于: innerHTML 会把替换内容里的 HTML 标记解释执行。 innerText 会把替换内容里的 HTML 标记原样输出而不执行。 例如有如下代码: var content = "<b>这是对innerHTML和innerText的测试</b>" ; // 假设 e 为网页内某元素 e.innerHTML = content ; // 显示结果为粗体的 这是对innerHTML和innerText的测试 e.innerText = content ; // 显示结果为 <b>这是对innerHTML和innerText的测试</b>
innerHTML和innerText怎么区分的更多相关文章
- innerHTML和innerText区分
示例代码:<div id="test"> <span style="color:red">test1</span> test ...
- innerHTML与innerText的异同
在一道面试题中看到的. 1.功能讲解: innerHTML 设置或获取位于对象起始和结束标签内的 HTML outerHTML 设置或获取对象及其内容的 HTML 形式 innerText 设置或获取 ...
- JS中innerHTML,innerText,value
一·.JS初学者易混淆的问题:innerHTML,innerText,value(他们和JQ的区别:JS→value,JQ→value()) 1.getElementById("a" ...
- JS魔法堂:被玩坏的innerHTML、innerText、textContent和value属性
一.前言 由于innerText并非W3C标准属性,因此我们无法在FireFox中使用它(修正:FF45+已经支持innerText属性),一般情况下我们可以使用textContent来代替,但它两者 ...
- JS中innerHTML 和innerText和value的区别
(1)innerHTML 和innerText和value的区别: innerHTML innerText是对非表单元素进行操作的. value是对表单元素进行操作的. (2)innerHTML 和i ...
- (转)JS中innerHTML,innerText,value
原文:http://holysonll.blog.163.com/blog/static/21413909320134111054352/ JS中innerHTML,innerText,value 2 ...
- (转)innerHTML、innerText和outerHTML、outerText的区别
原文:http://walsh.iteye.com/blog/261966 innerHTML.innerText和outerHTML.outerText的区别 博客分类: CSS/ ...
- innerHTML与innerText的PK
一.innerText属性用来定义对象所要输出的文本,在本例中innerText把对象it中的文本"您喜欢看微微一笑很倾城吗?"变成了"超级喜欢!"(语句it. ...
- innerHTML和innerText
document 对象中有innerHTML和innerText 两个属性, 这两个属性都是获取document对象的文本内容的,这两个属性间有哪些区别呢?通过几个例子来看一下. 示例1 <ht ...
随机推荐
- fabric网关模式文件上传与执行
- idea发布到tomcat缺少jar
主要是需要自己添加jar到artifact,如果单个添加jar,则在右边栏右键选择 如果是把整个lib添加到toamcat发布,则选择下面的提示:
- Effective C++ 条款05:了解C++编写并调用哪些函数
规则一 编译器默认操作 // 你认为 class Empty { }; // 实际上 class Empty { public: Empty() { ... } // default 构造函数 Emp ...
- 初入Spring-boot(三)
Spring boot 的运行原理 Spring boot关于自动配置的源码在spring-boot-autoconfigure-xxxx.jar内. 一.可以通过下面三种方式查看当前项目中已启用和未 ...
- python学习笔记(控制语句)
博主平时学python的时候.大多是复制网上别人现成的进行改动实现自己的测试的要求 所有python基础语法其实掌握的很差 本来想优化下接口脚本实现.发现基础的循环控制语句都不知道怎么写 所以准备整理 ...
- jquery.js和jquery.min.js的区别介绍
1.区别:jquery官网提供2种jQuery的下载,一种是jquery.js另一种是jquery.min.js文件名不一定完全相同,但通常情况下:jquery.js是完整的未压缩的jQuery库,文 ...
- spring3: AOP 之代理机制
Spring AOP通过代理模式实现,目前支持两种代理:JDK动态代理.CGLIB代理来创建AOP代理,Spring建议优先使用JDK动态代理. JDK动态代理:使用java.lang.reflect ...
- Docker 应用实例
Docker安装Nginx 方法一.通过 Dockerfile构建 创建Dockerfile 首先,创建目录nginx,用于存放后面的相关东西. runoob@runoob:~$ mkdir -p ~ ...
- mysql查询结果带上序号
select (@i:=@i+1) as rownum,t1.id ","from mega_user t1,(select @i:=0) t2 order by t1.gold ...
- css清除浮动float的几种方法
摘要: css清除浮动float的三种方法总结,为什么清浮动?浮动会有那些影响? 一.抛一块问题砖(display: block)先看现象: 这里我没有给最外层的DIV.outer 设置高度, ...