关于innerHTML的用法,以及数据覆盖问题

关于innerHTML的用法

innerHTML用于在HTML节点中插入一段HTML,需要注意的是使用innerHTML后该节点原来的html会被被覆盖
出现的问题：
代码

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body><div class="demo">111111</div><script>var arr = [{ name: "<p>" + '123' + "</p>" },{ name: "<p>" + '456' + "</p>" },{ name: "<p>" + '789' + "</p>" }]for (let item of arr) {console.log(item);document.getElementsByClassName("demo")[0].innerHTML = item.name;}</script>
</body></html>

这与我们期望的结果不一样的，arr中三条数据只输出最后一条，这是因为使用时没有加上 + 代码加上加号后HTML等于进行了一次又一次的拼接

更改处的：

  document.getElementsByClassName("demo")[0].innerHTML += item.name;

正确的显示了，数据也没被覆盖

关于innerHTML的用法,以及数据覆盖问题相关推荐

Linux tar命令高级用法——备份数据
Linux tar命令高级用法--备份数据 2015-12-31 Linux学习 Linux上有功能强大的tar命令,tar最初是为了制作磁带备份(tape archive)而设计的,它的作用是把文件 ...
php往文件里面写入数据,PHP创建文件及写入数据(覆盖写入,追加写入)的方法详解...
本文实例讲述了PHP创建文件及写入数据(覆盖写入,追加写入)的方法.分享给大家供大家参考,具体如下: 这里主要介绍了PHP创建文件,并向文件中写入数据,覆盖,追加的实现代码,需要的朋友可以参考下: 创 ...
php 提交的数据覆盖,如何高效的做数据覆盖操作
我有一批数据是通过第三方接口更新的,那个接口是按分类获取的,同一个分类的下的数据每次获取玩要要进行覆盖处理, 比如图书这次获取的是1,2,3这三个id的数据三本书过10秒我还按图书分类获取获取的是 ...
SenchaTouch中出现数据覆盖以及 “Cannot call method 'setData' of nul”l错误的可能原因
SenchaTouch中出现数据覆盖的可能原因当在ST系统中有多出Store使用同一个Model时,如果两个不同 Store的data中的 id 字段有重复的,则会出现数据紊乱的现象,比如两个列表 ...
javascript 中innerHTML的用法
javascript 中innerHTML的用法语法 Object.innerHTML = "HTML";//设置其内容 var html = Object.innerHTML; ...
php追加写入,PHP创建文件及写入数据(覆盖写入,追加写入)的方法详解
本文实例讲述了PHP创建文件及写入数据(覆盖写入,追加写入)的方法.分享给大家供大家参考,具体如下: 这里主要介绍了PHP创建文件,并向文件中写入数据,覆盖,追加的实现代码,需要的朋友可以参考下: 创 ...
php 旧数据覆盖,旧文件被新数据覆盖了文件还能恢复吗？
原标题:旧文件被新数据覆盖了文件还能恢复吗? 文件被覆盖了数据还能恢复吗?文件覆盖一般是指原有的文件被新的同名文件覆盖,导致之前的数据丢失的情况.这些和误删除和误格式化不同,主要是文件被替换的过程,这 ...
JavaScript中textContent、innerText和innerHTML的用法以及区别
目录 0.码仙励志 1.textContent的用法 1.设置标签中的文本内容 2.获取标签中的文本内容 2.innerText的用法 1.设置标签中的文本内容 2.获取标签中的文本内容 3.inne ...
数据丢失！手机数据覆盖是否还能找的回来
当遇到数据丢失时,一般都会先上网搜索如何恢复的方法,无法自己恢复后再找专业人士帮忙,在此过程中,经常会看到一个词:覆盖. 什么是数据覆盖举个例子:一张写满铅笔字的纸,用橡皮擦擦去上面的字,这就相当于 ...

关于innerHTML的用法,以及数据覆盖问题

关于innerHTML的用法

关于innerHTML的用法,以及数据覆盖问题相关推荐

最新文章

热门文章