问如何将一个巨大的div拆分成多个div？

EN

我有一项任务，我不确定如何最好地完成它。因此，我想要一些意见或建议:)

好的，这就是我需要做的。

我有一个包含发送到打印机的内容的页面(它包含div、p、span、h1、h2、h3、hr、a等标记中的图像和文本)。假设它大约有1500像素高。

我有一个容器div，比方说300x500像素。

我需要获取包含所有内容的页面，并将这些内容拆分为div。

所以：

_______________
|              |
|              |
|              |
|   Content    |
|              |
|              |
|              |
|______________|

包含以下内容：

_______________
|   Part 1     |
|______________|
|   Part 2     |
|______________|
|   Part 3     |
|______________|
|   Part 4     |
|______________|

但我的问题是，我如何在页面上获得一个包含多个元素的巨大对象，并遍历它，并确定这个div应该被一分为二，放在第1部分和第2部分中，因为它不能放入第1部分的剩余空间中？我如何确定哪些是剩余的，哪些不是？

我的想法是将body标记的整个内容读入一个变量，循环遍历每个元素，并将其添加到另一个具有剩余空间的变量中，我可以根据DOM元素的高度和宽度来确定。但我不确定这是不是最好的主意。