[英]Innerhtml keeps adding up instead of replacing it - javascript - html
[英]javascript innerHTML adding instead of replacing
快速提问,我知道我们可以更改
<div id="whatEverId">hello one<div>
通过使用:
document.getElementById("whatEverId").innerHTML="hello two";
现在,有没有办法可以将东西添加到 div 而不是替换它??? 所以我可以得到
<div id="whatEverId">hello one hello two<div>
(当然使用类似的东西)
<div id="whatever">hello one</div>
<script>
document.getElementById("whatever").innerHTML += " hello two";
</script>
Notice that using element.innerHTML += 'content'
would empty input
s and textarea
s to their default, blank state, unclick checkboxes, as well as removing any events attached to those elements (such as onclick
, on hover
etc.) because the整个innerHTML
将被浏览器重新解释,这意味着.innerHTML
将被清空并重新从头开始填充组合内容。
如果您需要保留 state,则需要创建一个新元素(例如<span>
)并将 append 保留为当前元素,如下所示:
let newElement = 'span'
newElement.innerHTML = 'new text'
document.getElementById('oldElement').appendChild(newElement)
document.getElementById("whatEverId").innerHTML = document.getElementById("whatEverId").innerHTML + "hello two" + document.getElementById("whatEverId").innerHTM ;
jcomeau_ictx 建议的是一种编辑innerHTML 的低效方式。 查看本樱桃的PPT http://www.bcherry.net/talks/js-better-faster
正确的方法是分离元素并对其进行更改,然后将其附加回父节点。 使用https://gist.github.com/cowboy/938767 Native javascript 从这个要点分离元素。
如果要追加,则只需将 = 更改为 +=
document.getElementById("whatEverId").innerHTML += '你好二';
如果加前缀
document.getElementById("whatEverId").innerHTML = '你好二' + document.getElementById("whatEverId").innerHTML;
虽然我强烈建议使用 jQuery 或 MooTools javascript 库/框架来做这类事情。 如果您添加的标签不仅仅是文本节点,那么您应该使用 DOM createElement 或上述库/框架之一。
你可以通过像这样附加 div 字符串来做到这一点。
document.getElementById('div_id').innerHTML += 'Hello Two';
感谢您提供此信息。 现在如果我们想减去怎么办? 就我而言,我正在制作一个电话号码簿,并想删除一个数字/退格键。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.