创建草图：.html（）和.append（）之间的区别？

Question

我正在“复制”this sketchpad project，这意味着用X x X方格填充页面。为了做到这一点，我必须创建一个div容器（用X方块填充），然后继续添加带有.append()的X div容器。

创建（比方说）16x16方格时，草图显示完美。但是，当我尝试创建64x64时，草图板的第一行，几行仅部分填充。

调查问题，我注意到JS文件（github），我知道这行代码有帮助，但我不知道原因：

$('#grid_container').html("");

换句话说，为什么.append()足够用于较小的草图，但不适用于较大的草图？

Answer 1

第一次不需要

$('#grid_container').html("")，因为div已经为空。但是，当您单击另一个按钮时，其目的是创建一个全新的网格。所以你想在添加元素之前先清空div（使用append()）这就是为什么$('#grid_container').html("");用于清除现有网格的原因。

Answer 2

以下是文档：

.html()
.append()

Answer 3

$('#grid_container').html("");将清除#gridcontainer内的任何内容。

Append不会清除任何内容，它只是在容器的末尾添加了另一个元素。