Javascript:innertext和innerhtml的区别
文章目录
- 前言
- 一、区别
- 二、代码示例
- 1.代码演示
- 2.最终效果
前言
在Javascript中,通过控件对象的innertext和innerhtml属性都可以对控件对象的显示文字进行读取和修改,那么innertext和innerhtml属性的区别到底在哪里呢?
一、区别
innertext:不识别html标签,非标准,在修改文字时自动去除空格和换行;在读取时,innertext属性只将文本内容完全读出
innerhtml:能够识别html标签,W3C标准,能够保留空格和换行;在读取时,innnerhtml属性能够将内置的html标签等内容完全读出
二、代码示例
1.代码演示
代码如下(示例):
<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head><body><div id="innertext_div"></div><div id="innerhtml_div"></div><p>我是文字:<span>今天天气真好啊</span></p><script>//innertext:var divtext = document.querySelector('#innertext_div');divtext.innerText = '<strong>今天天气</strong> 真好啊';//innerhtml:var divhtml = document.querySelector('#innerhtml_div');divhtml.innerHTML = '<strong>今天 天气</strong>真好啊';//进行读操作var p = document.querySelector('#innertext_div');console.log(p.innerText);console.log(p.innerHTML);</script>
</body></html>
2.最终效果
Javascript:innertext和innerhtml的区别相关推荐
- innerText 和 innerHTML的区别
innerText 和 innerHTML的区别 1.innerText不识别html标签,非标准,会自动去除空格和换行 var div = document.querySelector('div') ...
- innerText 与 innerHtml的区别 (一)
innerText 与 innerHtml 都是打印标签之间的文本信息 1.innerText 打印标签之间的纯文本信息,会将标签过滤掉,低版本的火狐浏览器不支持,而是支持textContent & ...
- JS中innerText和innerHTML的区别
innerText主要是设置文本的,甚至标签内容,是没有标签的效果的. innerHTML主要的作用是在标签中设置新的heml标签内容,是有标签效果的 先来看看innerText的效果 <!DO ...
- innerText与innerHTML的区别
innerText: innerText可以获取标签间的内容,如果标签间只有文本的话,则是直接获取.如果标签间还有嵌套标签的话,则会将嵌套标签忽略掉获取文本. innerText在给标签设置内容的时候 ...
- innerText和innerHTML的区别
innerText 不识别htm1标签非标准 去除空格和换行 var div = document . querySelector('div'); div.innerText = '<stron ...
- JavaScript中textContent、innerText和innerHTML的用法以及区别
目录 0.码仙励志 1.textContent的用法 1.设置标签中的文本内容 2.获取标签中的文本内容 2.innerText的用法 1.设置标签中的文本内容 2.获取标签中的文本内容 3.inne ...
- javascript 中的innerHTML的用法
javascript中innerHtml用法 2009-04-21 22:52 <html> <head> <script language="javascri ...
- js操作元素:改变元素内容有两种方式: interText 和 innerHTML的区别, 常用的元素的属性操作, 仿电脑系统时间问好 ,表单元素的属性操作 ,案例:仿京东显示隐藏密码 ,样式属性操作
文章目录 操作元素 改变元素内容有两种方式: interText 和 innerHTML的区别 常用的元素的属性操作 案例:仿电脑系统时间问好 表单元素的属性操作 案例:仿京东显示隐藏密码 样式属性操 ...
- innerText和innerHTML改变元素内容
1.innerText: 以点击按钮,div里的文字显示当前时间为例: <button>显示当前系统时间</button> <div>某个时间</div> ...
最新文章
- SPSS单一样本的T检验
- 四川c语言二级成绩查询,四川省计算机等级考试二级C语言考试分析(hcy__ ).ppt
- python原始web与django框架 mvc模式开发
- bzoj 1801: [Ahoi2009]chess 中国象棋【dp】
- 【转】PF_RING学习笔记
- bulk批量下载影像
- Python模块之uuid
- 同期两篇 Nature:运行温度高于 1K 的量子计算平台问世!
- 为什么要进入 5G 时代?
- Android 9.0/P 开发问题及解决方案汇总
- HCIE-Security Day28:IPSec:实验(三)总部采用ISAKMP方式安全策略组与分支机构之间建立IPSec PN
- gyp verb ensuring that file exists: C:\Python27\python.exe
- 2018年度总结 - 黑子
- MATLAB实现香农编码
- 2020年最好用的手机是哪一款_2020最好用的5G手机是哪一款?热销2020年5g手机推荐及点评...
- threejs正方体六面贴图
- http //t cn/xx 等链接的生成与还原
- linux pv 文件夹,Linux 实用命令 - pv
- ubuntu IPV6及作为路由分配【笔记】
- 【无标题】软件企业认定条件(双软企业认定条件2022)
热门文章
- 百度UNIT 关于导航的连续意图识别的解决方案
- 数组的5种遍历(for循环、for...in、for...of、forEach()、map()
- python对数据进行分类、文件是csv文件_用Python将处理数据得到的csv文件分类(按顺序)保存...
- html div 左上角写字,DIV/CSS:一个贴在左上角的标签
- Ubuntu下好用的音乐播放器Audacious
- Intellij IDEA 安装配置(超详细)
- notepadd++配置Scala运行环境
- bochs上网镜像怎么上网_bochs core镜像可上网版
- 辞职创业快三年了......
- 华为ultrapath命令linux,华为UltraPath多路径软件配置ASM磁盘