js中innerHTML和innerText的用法
<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的用法的更多相关文章
- js中innerHTML与innerText的用法与区别
用法: <div id="test"> <span style="color:red">test1</span> te ...
- (转)JS中innerHTML,innerText,value
原文:http://holysonll.blog.163.com/blog/static/21413909320134111054352/ JS中innerHTML,innerText,value 2 ...
- JS中innerHTML,innerText,value
一·.JS初学者易混淆的问题:innerHTML,innerText,value(他们和JQ的区别:JS→value,JQ→value()) 1.getElementById("a" ...
- JS中innerHTML 和innerText和value的区别
(1)innerHTML 和innerText和value的区别: innerHTML innerText是对非表单元素进行操作的. value是对表单元素进行操作的. (2)innerHTML 和i ...
- JS中innerHTML和innerText,outerHTML和outerText
innerHTML 声明了元素含有的HTML文本,不包括元素本身的开始标记和结束标记 innerHTML是符合W3C标准的属性,而innerText只适用于IE浏览器(现在也适应chrome浏览器 ...
- js中innerHTML、outerHTML与innerText的用法与区别
____________________________________________________________________________________________________ ...
- JS中innerHTML、outerHTML、innerText 、outerText、value的区别与联系?jQuery中的text()、html()和val()
一.JS中innerHTML.outerHTML.innerText .outerText.value的区别与联系?jS中设置或者获取所选内容的值:①innerHTML :属性设置或返回该标签内的HT ...
- js中substring和substr的用法
js中substring和substr的用法 substring 方法用于提取字符串中介于两个指定下标之间的字符 substring(start,end) 开始和结束的位置,从零开始的索引 参数 ...
- 第22篇 js中的this指针的用法
前面把js的相关知识总结了下,今天把js中的上下文的this,对于强类型语言,this的用法非常的单一,因为他们没有js特有的动态绑定. 首先看下面代码: function funcA() { thi ...
随机推荐
- day 17python 面对对象之继承
一:什么面向对象的继承? 比较官方的说法就是: 继承(英语:inheritance)是面向对象软件技术当中的一个概念.如果一个类别A“继承自”另一个类别B,就把这个A称为“B的子类别”,而把B称为“A ...
- vue 组件之间的数据传递
父组件传数据给子组件 创建数据 获取json数据 子组件传数据给父组件 1. 子组件使用$emit监听数据 getAreaValues(){ this.$emit('getAreaValues', { ...
- 解决waveInOpen录音编译x64程序出错的问题
1.之前也碰到过x86程序升级为x64程序,关键点是类型大小的使用. 之前同事碰到过一个用int表示指针的程序,程序改为x64会出错,找原因找了半天. 2.今天我也碰到了,使用aveInOpen录音, ...
- Spring Security构建Rest服务-0600-SpringSecurity基本原理
一.引入 只要引入了spring-boot-starter-security,所有的服务都会被保护起来.启动项目,打开时所有的controller会被保护起来,随便访问一个,如http://local ...
- 解决ajax跨域问题的一种方法
解决ajax跨域问题的一种方法 前后端分离经常用json来传输数据,比较常见的问题就有ajax跨域请求的错误问题,这里是我的一种解决方法: 在java中加入如下的注解类: import org.spr ...
- NiftyDialogEffects-多种弹出效果的对话框
感觉系统自带的对话框弹出太生硬?那就试试NiftyDialogEffects吧,类似于(Nifty Modal Window Effects),效果是模仿里面实现的 ScreenShot . . ...
- 原来你一直写错了?!实力分享一波 CSS 使用的书写规范顺序与偏门又实用的样式...
我们在埋头写代码的时候,还要学会收集整理一些常用的代码小技巧,以便在工作时候,可以及时调取,提高工作效率. 今天,我把之前收集整理的一些CSS代码小技巧分享出来,供你参考学习,希望对你有帮助. 一.C ...
- java.io.Serializable的作用
Serializable,之前一直有使用,默认的实体类就会实现Serializable接口,对具体原因一直不是很了解,同时如果没有实现序列化,同样没什么影响,什么时候应该进行序列化操作呢?今天查了下资 ...
- Aviator 表达式求值引擎开源框架
简介¶ Aviator是一个高性能.轻量级的java语言实现的表达式求值引擎,主要用于各种表达式的动态求值.现在已经有很多开源可用的java表达式求值引擎,为什么还需要Avaitor呢? Aviato ...
- POJ 1062 昂贵的聘礼(枚举限制条件——Dijkstra算法)
题目: 年轻的探险家来到了一个印第安部落里.在那里他和酋长的女儿相爱了,于是便向酋长去求亲.酋长要他用10000个金币作为聘礼才答应把女儿嫁给他.探险家拿不出这么多金币,便请求酋长降低要求.酋长说:& ...