Javascript 网格上具有最少数量空单元的元素的位移

请告诉我，是否有算法或现成的解决方案来替换网格内的元素，以便已替换的元素占据网格上具有最少空单元格数的位置

例如：

是的

9点被选中。含有1的块减少为一个细胞。一个含有9个细胞的区块增加到6个细胞

有必要分散从空位中驱逐出来的人员

---

这没那么容易。。。（简单的尝试失败了，但可能有人可以改进它）如果要保持元素的顺序，此布局可能存在一些问题。如果在JSFIDLE中单击1，然后单击5，您将注意到5是如何处于正确位置的，但是它从右向左跳。Maraca，谢谢您的尝试。我自己也不知道如何解决这个问题。如果你用js定位absolute，那么这是可能的，我试图制作一个基于CSS的版本，你所做的就是添加和删除所选的类。但是，如果可能的话，你必须是一个CSS向导才能做到这一点。你想保持元素的顺序吗？