如何使用 JavaScript 清除 div 的内容?

IT技术 javascript html css
2021-01-14 05:41:53

当用户单击我页面上的按钮时,应该清除 div 的内容。我将如何去完成这个?

2个回答

只是 Javascript(根据要求)

在您的页面上的某处添加此功能(最好在<head>

function clearBox(elementID)
{
    document.getElementById(elementID).innerHTML = "";
}

然后在点击事件上添加按钮:

<button onclick="clearBox('cart_item')" />

在 JQuery 中(供参考)

如果你更喜欢 JQuery,你可以这样做:

$("#cart_item").html("");
@Mic的回答快了大约 250 倍。jsperf.com/innerhtml-vs-removechild
2021-03-15 05:41:53
@Tom Gullen:请注意,这不会删除与该 div 内的节点关联的事件处理程序。
2021-03-18 05:41:53
@Tom Gullen 这对我有用,无需将 DIV 的 id 传递到函数中,并且在函数本身的 elementID 周围加上单引号。谢谢你!
2021-03-22 05:41:53
你也可以使用 .detach() 吗?
2021-03-23 05:41:53
替代jQuery: $("#cart_item").empty();
2021-03-31 05:41:53

你也可以用 DOM 方式来做:

var div = document.getElementById('cart_item');
while(div.firstChild){
    div.removeChild(div.firstChild);
}
这感觉比innerHTML = ''. 我会亲自写额外的几行
2021-03-17 05:41:53
@Sukima 这种方式比首选答案更快,所以如果您需要更好的性能而不是短代码,这是您的选择。
2021-03-17 05:41:53
作为一个班轮 while(div.firstChild && div.removeChild(div.firstChild));
2021-03-18 05:41:53
顶尖!与 jQuery 相同: $("#cart_item").empty(); 作用于 DOM 而不仅仅是内容。伟大的!
2021-03-19 05:41:53
这是首选innerHTML = ''吗?如果是,为什么?
2021-04-08 05:41:53