innerHTML（html()）和innerText（text()）的区别

已于 2023-09-28 00:22:21 修改
阅读量1.9k 收藏 2
点赞数 3
分类专栏： html-css js-jQuery 文章标签： html jquery innerHTML innerText
于 2017-11-09 10:59:20 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/niceLiuSir/article/details/78486784
版权

innerHTML（html()）和innerText（text()）的区别

innerHTMl对应jQuery的html()，可以作用于标签；

// 这样会出现字体加粗的效果
innerHTML = "<b>文本</b>"

innerText对应jQuery的text()，只能作用于文本。

// 这样不会出现字体加粗的效果而是将整个"<b>文本</b>"当作字符串
innerText= "<b>文本</b>"

感谢您的阅读，欢迎参观我的个人网站：知行乐集【www.zhixinglj.cn】

niceLiuSir
关注
  • 3
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
专栏目录
innerHTML和innerText的区别
05-10
js中innerHTML与innerText的用法与区别
innerHTML与innerText区别
热门推荐
蜗牛学习笔记
03-08 8万+
innerHTML指的是从对象的起始位置到终止位置的全部内容,包括Html标签。 innerText 指的是从起始位置到终止位置的内容,但它去除Html标签。 同时，innerHTML 是所有浏览器都支持的，innerText 是IE浏览器和chrome 浏览器支持的，Firefox浏览器不支持。其实，innerHTML 是W3C 组织规定的属性；而innerText 属性是IE浏览器自己的属性，不过后来的浏览器部分实现这个属性罢了。
innerHTML和innerText区别
bailizx
05-08 6092
目录 1 总结 2 读取html中元素 3 在设置html元素的时候 1 总结 innnerHTML用来获取标签元素或设置标签元素，包含文本和Html标签。在读取元素的时候，会将文本和Html标签一起读取出来；在设置元素的时候，会覆盖掉原来的元素中文本和标签，如果新的内容包含标签，会解析Html标签，只显示文本，而不将标签显示出来。 innerText用来设置或获取标签内文本内容, ...
innerHTML和innerText的区别：
weixin_51338296的博客
08-26 416
innerHTML和innerText之间的区别：innerHTML能识别HTML标签，在通过此属性更改HTML内容时，你写入一个html标签，innerHTML能识别出这是一个HTML标签，然后他会将此标签所带的样式应用到内容中去，并且此标签不会被输出到页面中。...
innerHTML和innertext的区别
Web_Struggle的博客
10-06 553
innerHTML和innertext的区别很容易区分，那什么时候用innerHTML，innertext呢。 innerHTML获取的是标签的内容。而innertext获取的是标签的节点。 我们来举个例子。
innerhtml用法 innertext用法 以及innerHTML与innertext的区别
12-11
test.innerText: 从起始位置到终止位置的内容, 但它去除Html标签 上例中的text.innerTest的值也就是“test1 test2”, 其中span标签去除了。 test.outerHTML: 除了包含innerHTML的全部内容外, 还包含对象标签本身。 ...
javascript中innerText和innerHTML属性用法实例分析
12-10
本文实例讲述了javascript中innerText和innerHTML属性用法。分享给大家供大家参考。具体分析如下： 几乎所有DOM元素都有innerText,innertHTML属性(注意大小写),分别是元素标签内 的文本表示形式和HTML源代码，这两个...
js中innerText/textContent和innerHTML与target和currentTarget的区别
01-19
一、获取/赋值文本值innerText/textContent、innerHTML <body> <div id=box_text> <p xss=removed>muzidigbig <p xss=removed>lovely <input type=text id='getValue' placeholder=输入值> ...
JavaScript中innerHTML，innerText，outerHTML的用法及区别
12-28
不废话了，请看下文示例介绍。 用法： <span xss=removed>test1</span> test2 在JS中可以使用： test[removed]: 　也就是从对象的起始位置到终止位置的全部内容...　上例中的text.innerTest的值也就是“test1 test2
IE6与IE7中，innerHTML获取param的区别
11-30
代码： 代码如下:<html> <head> [removed]<!– function setMode(newMode) { var text1=document.... } else { cont=text1.innerText; text1[removed]=cont; } } // –>[removed] </head
innerHTML 和innerText的区别
hztiao的博客
11-26 221
1）innerHTML设置或获取标签所包含的HTML+文本信息(从标签起始位置到终止位置全部内容，包括HTML标签) 2）innerText设置或获取标签所包含的文本信息（从标签起始位置到终止位置的内容，去除HTML标签） 示例： //此时的a对象是p标签对象 console.log(a.innerHTML) //输出的是 Text in DIV console.log(a.innerTEXT) //输出的是 Text in DIV //此时的a对象是外层的div对象...
innerHTML与innerText的区别: 前者获取的是dom对象内的所有html元素 后者获取的是dom对象里面的纯文本元素...
weixin_30823001的博客
01-27 394
转载于:https://www.cnblogs.com/classmethond/p/10327927.html
innerHTML 和 innerTEXT 区别
HAQINXI的博客
12-17 158
val()函数专门用于操作表单中的input。 val() : 这是获取input的value属性值 val(写一个值) ： 这是给input的value属性赋值 value属性 input type=text ,它的value值就是用户输入的内容，当然除了用户输 入外，也可以使用value属性来指定 剩下所有的type类型，value属性值都是显示的声明出来的。 text() ： 给所有（除了input）的html节点赋值文
innerHTML和innerTEXT的区别
alokka的博客
06-12 574
<div id="box"> <p>这是一个P标签</p> <p>这是一个P标签</p> <p>这是一个P标签</p> <p>这是一个P标签</p> </div>var box = document.getElementById("box"); console.log(box.innerText); 这是innerText的用法 ，直接获取标签之间的文本内容
innerHTML和innerText得区别
weixin_45321331的博客
05-17 135
innerHTML和innerText他们都是获取文本内容 innerHTML：是W3C提出得，是标准得,所有浏览器都支持，保留标签和空格 innerText：ie浏览器自己得属性，非标准，不保留标签和空格
.value，.innerHTML，.innerText在JS中使用的区别
最新发布
05-31
在 JavaScript 中，`.value`、`.innerHTML` 和 `.innerText` 是用于获取或设置元素内容的属性。 `.value` 属性通常用于表单元素，如输入框和下拉列表。它用于获取或设置表单元素的值。例如，如果有一个输入框元素： ``` <input type="text" id="myInput"> ``` 您可以使用以下代码获取或设置它的值： ``` var inputElement = document.getElementById("myInput"); var inputValue = inputElement.value; // 获取输入框的值 inputElement.value = "Hello, world!"; // 设置输入框的值 ``` `.innerHTML` 属性用于获取或设置元素的 HTML 内容。例如，如果有一个 div 元素： ``` <div id="myDiv"></div> ``` 您可以使用以下代码获取或设置它的 HTML 内容： ``` var divElement = document.getElementById("myDiv"); var htmlContent = divElement.innerHTML; // 获取 div 的 HTML 内容 divElement.innerHTML = "<p>Hello, world!</p>"; // 设置 div 的 HTML 内容 ``` `.innerText` 属性用于获取或设置元素的文本内容，但与 `.innerHTML` 不同，它会忽略 HTML 标签。例如，如果有一个 p 元素： ``` <p id="myP">Hello, <strong>world</strong>!</p> ``` 您可以使用以下代码获取或设置它的文本内容： ``` var pElement = document.getElementById("myP"); var textContent = pElement.innerText; // 获取 p 的文本内容，返回 "Hello, world!" pElement.innerText = "Goodbye, world!"; // 设置 p 的文本内容 ``` 需要注意的是，`.innerHTML` 和 `.innerText` 都可以用于获取和设置元素的内容，但它们之间存在一些差异。`.innerHTML` 可以用于设置元素的 HTML 内容，而 `.innerText` 仅用于设置元素的文本内容。此外，`.innerHTML` 可能会导致安全问题，因为它允许插入任意的 HTML 代码。因此，在设置 `.innerHTML` 时应格外小心。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值