清空并附加元素的扩展高度

Empty and append expanding height of element

本文关键字：扩展 高度 元素 清空      更新时间：2023-09-26

我正在运行以下代码：

$('#storeTable').empty();
$('#storeTable').append("<tr>");
$('#storeTable').append("<td>");
$('#storeTable').append(returnData["1"]["ID"]);
$('#storeTable').append("</td>");
$('#storeTable').append("</tr>");

但是，如果我在一次页面加载中多次运行它，则每次运行时"storeTable"元素都会变得越来越高。我是否错过了一些明显的东西，这是jQuery/JavaScript的陷阱，是我的浏览器（Chrome）的错误，还是我做错了什么？

代码显然需要改进，我只是想获得页面动态部分的基本实现。

如果您想要任何其他细节，请询问，而不是在没有评论的情况下投反对票。

当然，storeTable 也是一张桌子。

不能使用 .append() 来追加部分 HTML。 .append() 仅追加整个已形成对象，当追加它们时，它会将它们追加为目标对象的最后一个子对象。

除此之外，一些浏览器正在选择如何创建或不能创建/删除表中的内容。

假设#storeTable是<table>标记，您可以分配.html()一次创建一个全新的表：

$("#storeTable").html("<tr><td>" + returnData["1"]["ID"] + "</td></tr>");

工作演示：http://jsfiddle.net/jfriend00/5BVdX/

$('#storeTable').empty();
// Will create three rows, one after another
$('#storeTable').append("<tr><td>123</td></tr>");
$('#storeTable').append("<tr><td>456</td></tr>");
$('#storeTable').append("<tr><td>789</td></tr>");
// Will create three rows, each next replaces previous
$('#storeTable').html("<tr><td>123</td></tr>");
$('#storeTable').html("<tr><td>456</td></tr>");
$('#storeTable').html("<tr><td>789</td></tr>");
相关文章：