首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往
您找到你想要的搜索结果了吗?
是的
没有找到

JS中innerHTML、outerHTML、innerText、outerText的用法与区别

1、功能说明: innerHTML 设置或获取位于对象起始和结束标签内的 HTML innerText 设置或获取位于对象起始和结束标签内的文本 outerHTML 设置或获取对象及其内容的HTML...color:red">span1 span2 var innerHTML = document.getElementById("mydiv").innerHTML; var innerText...= document.getElementById("mydiv").innerText; //Firefox不支持 var outerHTML = document.getElementById(...对Firefox是不支持的,因此,尽可能地去使用innerHTML, 而少用innerText,如果要输出不含HTML标签的内容,可以使用innerHTML取得包含HTML标签的内容后, 再用正则表达式去除...>/gim,'')); 查看演示:http://itmyhome.com/js_innerHTML_innerText_differences/ 作者:itmyhome 发布者:全栈程序员栈长,

1K20

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

一、前言                                 由于innerText并非W3C标准属性,因此我们无法在FireFox中使用它(修正:FF45+已经支持innerText属性)...IE各版本和Chrome下对innerText进行取值均执行上述4步,但效果不尽相同。...但innerText的取值永远是空字符串。      c). value可被设置且生效,但不会影响innerHTML和innerText的取值。  ...b). innerText可被设置且生效,无条件影响value取值。但不影响innerHTML和textContent。innerText的取值由innerHTML的属性值经过处理后返回。...d). value可被设置且生效,但不会影响innerHTML、textContent和innerText的取值。

2.5K70

MutationObserver接口-2-观察范围

/ 没有效果,因为文本节点没有innerText属性 差异: innerText属性不会获取display为none的隐藏元素,而textContent会获取...innerText没有格式,而textContent有格式 文本节点没有innerText属性 从上面可以看到,innerText属性不会获取display为none的隐藏元素,而textContent...当我们观察节点时修改的是innerText,而不是textContent的话,会引发不一样的情况(个人认为算bug了,如果有了解原因的小伙伴,可以评论交流) 另外红宝书不建议使用innerText,但是...包括开始观察后innerText之前和之后的。 即使不混用,也还是有问题。...= '123' document.body.innerText = '456' document.body.innerText = '789' 上面的代码不会打印任何东西。

38420

总结操作标签的内容

本文内容概要: 1 innerHTML与outerHTML属性 2 innerText与outerText属性 3 课后作业 1 innerHTML与outerHTML属性 前几期我们接触了innerHTML...而谷歌、火狐会将内容按照原来的格式返回HTML,包括空格和缩进; 2 innerText与outerText属性 能够操作标签内容的不仅仅只有innerHTML和outerHTML属性,还有innerText...代码分析: innerText与outerText属性获取标签内的内容(不包含标签,只获取文本内容); 火狐浏览器不支持outerText属性,所以获取的结果为undefined; innerText...属性设置标签的内容 wrapObj.innerText = '利用innerText属性设置标签的内容'; 结果: ?...与outerText属性总结 innerText ourterText :能够获取/设置元素的内容(元素内容是文本内容); innerText与outerText获取标签内容的时候是具有相同功能; innerText

1.7K110
领券