Javascript 在html5中填充网格时如何避免空白？

如何避免填充网格时出现空格，我希望使用所有空格

在本例中，如何在带加号的div下面的空格中引入带数字4的div，并避免网格中的空格，带数字4的div是向下的，并且是网格的轮廓

这是我的代码：

html

---

这是清除浮动所需的

。 输入

<div style="clear:both"></div>

删除当前div的浮动并有效地创建新行

使用jQuery的解决方案：

1-取数字为4的div元素

var div_4 = $('#grid').children('div').eq(4);

2-从DOM中删除编号为4的div元素

div_4.remove();

3-在带加号的div后面添加带数字4的div元素

div_4.insertAfter($('#grid').children('div').eq(1));

这可以更优化

使用jQuery remove方法时，需要记住两件事：

虽然选择的元素是使用remove从DOM中删除的，但它们尚未从jQuery包装器集中删除。这意味着在理论上，您可以继续对它们进行操作，如果需要，甚至可以将它们添加回DOM中

此方法不仅将从DOM中删除元素，还将删除删除的元素可能包含的所有事件处理程序和内部缓存数据

---

如果您想要一个不使用jQuery的解决方案，请让我知道……

这是Packer和Mashine所做的事情。看一看。等等，我理解对了吗：你的意思是你想把div放在+的正下方，这样4就像一个完整的网格。。。就像一个数独网格。。。。你打算硬编码这个还是类似的，让计算机像拼图一样适应……所以像这样：是的，我想要那个，是一个拼图+1到派克，然后，如果你想快速简单地做它。如果你想自己做这件事，你需要查找bin packing algothrim并实现有更好的方法来清除浮动而不需要额外的标记。你打算在哪里使用它？这是一把小提琴。这不是OP想要的allI我用你的代码试过了但是4号的div移到了右边，我需要4号的div元素在加号的div下面。你是对的，我没有考虑元素的CSS属性…我还看不到jsfiddle.net中的示例，因为我的连接不好，但是如果您只想使用+将带有4个元素的添加到div下，请使用4:position:relative将此CSS规则添加到div元素中；顶部：-100px；

div_4.remove();

div_4.insertAfter($('#grid').children('div').eq(1));