• Ukieweb

    佳的博客

    曾梦想仗剑天涯,后来工作忙没去。

innerHTML、outerHTML 和 innerText 、outerText的区别

0 0

innerHTML vs outerHTML

image.png

innerHTML 

  •  属性设置或返回所有后代的html。

outerHTML 

  •  属性设置或返回对象本身及其所有后代的html。


示例 html 代码

<div>  hello  <b>world</b> </div>

获取值

image.png

设置 outerHTML 

image.png

设置 innerHTML 

image.png

设置 XXXhtml 可以插入标签

image.png

innerText vs outerText

innerText 和  outerText  与 innerHTML  和 outHTML 类似， 不同之处在于他们仅关注元素中包含的文本内容。


示例 html 代码

<div>  hello  <b>world</b> </div>

获取值

innerText 和  outerText  获取的值是一样的。

image.png

设置 outerText

image.png

设置 innerText 

image.png

XXXtext 中输入的标签也当作文本展示

image.png



参考：

HTMLElement: outerText property

element.outerHTML

0顶
0 踩
下一篇：阿里云日志服务SLS查询切分失败的原始日志 __raw_log__

共 0 条评论

新的评论

标签
轻松一刻 无关技术 这人生啊 驴友户外 系统 Windows Linux 工具软件 安全 容器 Docker Kuberneters Spring Boot JAVA VUE ceph pipeline Git Protobuf groovy mongo 阿里云 Element GO NODE Kafka Nginx CDN Python Django Mysql Haproxy 爬虫 Zabbix Vagrant 云服务 Jenkins C/C++ 概念原理 Tomcat 前端网站 UEditor JS&CSS

最近写的博文

博文归档

老佳啊

85后，大专学历，中原人士，家里没矿。

由于年轻时长的比较帅气，导致在别人眼里，我一直不谈恋爱的原因是清高，实则是自己的小自卑。最大的人生目标就是找一个相知相爱相容的人，共度余生。

和人相处时如果能感受到真诚，会非常注重彼此的关系，对别人没有什么心机，即使有利益冲突，一般也会以和为贵，因为在这个世界上，物质的东西，从来不会吸引到我。

特别迷恋那些大山大水，如果现在还能隐居，可能早就去了。对那些宏伟的有底蕴的人文景观比较不感冒。

从事于IT行业，却一直对厨房念念不忘，由于身材魁梧，总觉得自己上辈子是个将军，可惜这辈子没当兵，也不会打架。