innerHTML和innerText怎么区分?

最新推荐文章于 2023-10-18 22:51:26 发布
最新推荐文章于 2023-10-18 22:51:26 发布
阅读量337 收藏
点赞数 3
分类专栏： 前端 学习 js
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/lily2016n/article/details/54134934
版权
js 同时被 3 个专栏收录
30 篇文章 1 订阅
订阅专栏
前端
12 篇文章 0 订阅
订阅专栏
学习
7 篇文章 0 订阅
订阅专栏

innerHTML和innerText

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div id="text"><p>哈哈</p><span>嘻嘻</span></div>
<a href="javascript:alert(text.innerHTML)">innerhtml</a>
<a href="javascript:alert(text.innerText)">innertext</a>
</body>
</html>

点击innerhtml按钮会出现以下弹窗
点击innertext按钮会出现以下按钮
共同点：innerHTML和innerText都会把元素内内容替换掉。
不同点：1，innerHTML: 也就是从对象的起始位置到终止位置的全部内容,包括Html标签。2，innerText: 从起始位置到终止位置的内容, 但它去除Html标签

lily2016n
关注
  • 3
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
innerHTML和innerText的用法以及不同点
qq_43445758的博客
12-13 1802
innerHTML和innerText的区别 两者的主要区别在于用法不同； innerHTML可以将获取的元素作为HTML元素进行解析或修改， innerText可以将获取的元素作为纯文本进行解析或修改。 innerHTML和innerText的具体用法： <!DOCTYPE html> <html> <head> <meta charset="asmo-708"> <title></title> </head&gt
InnerHtml和InnerText的区别分析
09-06
在编程领域，尤其是在Web开发中，常常会遇到与HTML元素操作相关的属性，其中`InnerHtml`和`InnerText`是两种常见的属性，它们在处理网页内容时有着不同的行为和用途。本文将深入探讨这两个属性的区别，并提供详尽的...
JavaScript中的innerHTML使用
qq_60115503的博客
04-17 6万+
innerHTML innerHTML属性允许更改html元素的内容,可以设置或返回表格行的开始和结束标签之间的HTML,本篇文章就来给大家介绍关于innerHTML的用法
innerHTML 用法
yihuei123的专栏
04-23 6608
用法：比如在中写了如下的代码：现在用top.innerHTML="..........";的方法就可以向这个id的位置写入HTML代码了。例如top.innerHTML="";就可以在top对应的位置出现一个button了！爽吧，在公告前加javascript就行老，直接改HTML。。。function Test(){        var str="";        str+="Hel
【Java 进阶篇】深入了解 JavaScript 的 innerHTML 属性
最新发布
繁依Fanyi的博客
10-18 2354
在深入研究innerHTML属性之前，让我们先了解一下什么是DOM。DOM 是文档对象模型的缩写，它是HTML文档的编程接口，允许开发者通过编程方式访问、操作和更新HTML文档的内容和结构。DOM 将HTML文档表示为一个树状结构，每个HTML元素都是树中的一个节点，我们可以使用JavaScript来访问和修改这些节点。innerHTML是DOM元素的一个属性，它代表了该元素的HTML内容。也就是说，它包含了一个HTML元素的所有子元素、文本和标记。通过innerHTML。
html--innerHTML用法及和与innerText区别
Schaffer的博客
06-04 1万+
一、innerHTML用法 innerHTML在JS是双向功能：获取对象的内容 或 向对象插入内容； 如：<div id="aa">这是内容</div> 我们可以通过 document.getElementById(‘aa’).innerHTML 来获取id为aa的对象的内嵌内容； 也可以对某对象插入内容，如 document.getElementById(‘abc’).innerHTML=’这是被插入的内容’; 这样就能向id为abc的对象插入内容。 实例： 1.获取段落p的 in
innerHtml的用法及理解
cheng1a的博客
08-18 1万+
innerHtml标签可以获取标签内的html内容，用法为：document.getElementById(‘ xx ’).innerHTMLinnerHtml标签也可以用来设置标签内的html内容，用法为：document.getElementById(‘ xx ’).innerHTML=’需要设置的内容’;
innerHTML和innerText的区别
05-10
在 JavaScript 中，innerHTML 和 innerText 是两个常用的属性，它们用于获取 HTML 元素中的内容。虽然它们都是用于获取内容的，但它们在获取内容的方式和结果上有所不同。 innerHTML 属性 innerHTML 属性用于获取 ...
详谈innerHTML innerText的使用和区别
08-29
详谈innerHTML innerText的使用和区别 在HTML文档中，获取或设置标签中的内容是非常重要的。document对象中有innerHTML、outerHTML、innerText和outerText四个属性，它们之间的区别和使用方法是开发者必须掌握的...
innerhtml用法 innertext用法 以及innerHTML与innertext的区别
09-05
在网页开发中，DOM（Document Object Model）操作是不可或缺的一部分，`innerHTML` 和 `innerText` 是两个常用的属性，用于处理HTML元素的内容。了解它们的用法和区别对于编写兼容性的JavaScript代码至关重要。 `...
javascript innerText和innerHtml应用
10-29
### JavaScript中innerText与innerHTML的应用详解 在Web开发中，JavaScript是一种非常重要的客户端脚本语言，它可以帮助我们实现页面上的动态效果。在JavaScript中，`innerText`与`innerHTML`是两个非常常用的属性...
JavaScript之innerHTML和outerHTML，innerText和outerText
Karka_的博客
09-15 4557
innerHTML是符合W3C标准的属性，而innerText只适用于IE浏览器（现在也适应chrome浏览器），因此，尽可能地去使用innerHTML，而少用innerText，如果要输出不含HTML标签的内容，可以使用innerHTML取得包含HTML标签的内容后，再用正则表达式去除HTML标签。--申明当前网页的编码集UTF-8-->--编辑器的名称-->
HTML的DOM的innerHTML用法，简化动态表格，控制样式css
zhansan的博客
07-12 1368
" >删除\n"var text_a = document.createTextNode("删除");3. 创建td，设置td的文本为文本框的内容。5. 将td添加到tr中。//3.创建td，赋值td的标签体。//gender 的 td。//2.获取文本框的内容。//5.添加td到tr中。//name 的 td。//6.获取table。
innerHTML属性
suimingbo的博客
08-17 960
是一个用于读取或设置 HTML 元素内容的属性。它是 JavaScript 中常用的操作 DOM（文档对象模型）的属性之一。属性时应当小心防范潜在的安全风险，因为直接操作 HTML 内容可能导致跨站脚本攻击（XSS）。确保仅使用受信任的内容来设置。属性，您可以获取或修改指定元素的 HTML 内容。，或者使用其他安全性更高的方法来操作 DOM。
innerHTML的作用及用法。
xue_smail的博客
04-15 9796
对innerHTML的用法有些模糊，今天来总结一下： 1、innerHTML有两个作用： （1）获取对象的内容； （2）向对象插入内容； 例：这是内容 ，由于id是唯一的，我们可以不获取id。通过 a.innerHTML 来获取id为a的对象的内嵌内容； 也可以通过b.innerHTML = "这是被插入的内容"；在id为b的对象中插入内容。 例子1（获取对象的内容）： <body> ...
innerHTML 是什么用法
m0_57236802的博客
08-14 1472
innerHTML属性用于获取或设置HTML元素的内部HTML内容。你可以通过这个属性来插入新的HTML内容或获取现有内容。
innerHTML和outerHTML的异同点
fusheng_lee的博客
07-12 2458
innerHTML和outerHTML的异同点
innerHTML作用和用法
热门推荐
cuishao
09-05 10万+
innerHTML在JS是双向功能：获取对象的内容 或 向对象插入内容； 如：&lt;div id="aa"&gt;这是内容&lt;/div&gt; 我们可以通过 document.getElementById(‘aa’).innerHTML 来获取id为aa的对象的内嵌内容； 也可以对某对象插入内容，如 document.getElementById(‘abc’).innerHTM...
innerHTML的作用
欢迎来到 动感地带
05-27 1293
1、innerHTML有两个作用： （1）获取对象的内容； （2）向对象插入内容； 由于id是唯一的，我们可以不获取id，通过 innerHTML 来获取id为test的对象的内容； 也可以通过innerHTML = "这是被插入的内容"；在id为test的对象中插入内容。 例子1（能够获取对象的内容）： <body> <div id="test">这是弹出的内容</div> </body> <script type="text/
innerHTML和innerText的区别？
05-09
`innerHTML` 和 `innerText` 都是 JavaScript 中的 DOM 属性，用于获取或设置 HTML 元素的内容。 `innerHTML` 返回或设置 HTML 元素的所有子节点（包括标签、文本、注释等）的 HTML 内容，它可以读取和修改 HTML ...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值