我使用AJAX将数据追加到<div>元素,其中我从JavaScript填充<div>。我怎么能追加新的数据<div>而不丢失以前的数据在其中找到?
当前回答
java脚本
document.getElementById("divID").html("this text will be added to div");
jquery
$("#divID").html("this text will be added to div");
使用不带任何参数的.html()来查看您已经输入。 在代码中使用这些函数之前,可以使用浏览器控制台快速测试它们。
其他回答
小心innerHTML,当你使用它的时候,你会失去一些东西:
theDiv.innerHTML += 'content';
等价于:
theDiv.innerHTML = theDiv.innerHTML + 'content';
这将破坏你的div内的所有节点,并重新创建新的。对其中元素的所有引用和监听器都将丢失。
如果你需要保留它们(例如,当你附加了一个点击处理程序时),你必须用DOM函数(appendChild,insertAfter,insertBefore)附加新内容:
var newNode = document.createElement('div');
newNode.innerHTML = data;
theDiv.appendChild(newNode);
试试这个:
var div = document.getElementById('divID');
div.innerHTML += 'Extra stuff';
下面的方法不像其他方法那么通用,但是当您确定div的最后一个子节点已经是文本节点时,它非常有用。这样就不会使用appendData MDN Reference appendData创建新的文本节点
let mydiv = document.getElementById("divId");
let lastChild = mydiv.lastChild;
if(lastChild && lastChild.nodeType === Node.TEXT_NODE ) //test if there is at least a node and the last is a text node
lastChild.appendData("YOUR TEXT CONTENT");
为什么不直接使用setAttribute ?
thisDiv.setAttribute('attrName','data you wish to append');
然后你可以通过以下方法获得这些数据:
thisDiv.attrName;
IE9+ (Vista+)解决方案,无需创建新的文本节点:
var div = document.getElementById("divID");
div.textContent += data + " ";
然而,这并没有完全为我做的技巧,因为我需要一个新的行后,每条消息,所以我的DIV变成了一个有风格的UL与以下代码:
var li = document.createElement("li");
var text = document.createTextNode(data);
li.appendChild(text);
ul.appendChild(li);
来自https://developer.mozilla.org/en-US/docs/Web/API/Node/textContent:
与innerHTML的区别 innerHTML返回其名称所示的HTML。为了在元素中检索或编写文本,人们经常使用innerHTML。应该使用textContent代替。因为文本不是被解析为HTML,所以它可能具有更好的性能。此外,这避免了XSS攻击向量。
推荐文章
- 如何将两个字符串相加,就好像它们是数字一样?
- 绑定多个事件到一个监听器(没有JQuery)?
- 在JavaScript中将JSON字符串解析为特定对象原型
- 将字符串“true”/“false”转换为布尔值
- 在输入type="number"时禁用webkit的旋转按钮?
- 如何在另一个元素之后添加一个元素?
- 我如何有效地解析HTML与Java?
- “ ”和“”有什么区别?
- 如何使用JavaScript代码获得浏览器宽度?
- event.preventDefault()函数在IE中无法工作
- indexOf()和search()的区别是什么?
- 错误:'types'只能在.ts文件中使用- Visual Studio Code使用@ts-check
- React-Native:应用程序未注册错误
- LoDash:从对象属性数组中获取值数组
- src和dist文件夹的作用是什么?