[发明专利]一种智能分栏方法及系统

说明书

本发明涉及一种智能分栏方法，包括以下步骤：S1：将所有待分栏的内容装入原始DIV中，所述原始DIV的宽度为栏宽度，所述原始DIV的高度不限；S2：依次从原始DIV中取出原始DOM节点并将原始DOM节点逐个放入一个或多个高度为栏高度的分栏子DIV中的一个，如果当前的分栏子DIV不足以容纳原始DOM节点，则对原始DOM节点按高度进行切割并分配到分栏子DIV。一种智能分栏系统，用于实现上述一种智能分栏方法，包括数据接收接口、数据处理中心以及数据输出接口。通过基于HTML DOM结构动态调整，实现了不基于CSS3Columns的分栏，实现对最后一页在“先左再右”的人类视角下的分栏；同时最大幅度的利用纸张空间，节省资源，避免浪费；可与不支持CSS3的第三方工具进行结合使用。

技术领域

本发明涉及分栏领域，特别是一种智能分栏方法及系统。

背景技术

网页分栏是指将网页的宽度等分成N份。CSS3支持了此特性，它使用属性Columns用来设置元素的列宽和列数。多栏布局可以控制页面内容的排版方式，可以将文本内容设计成像报纸一样的多列布局。

使用CSS3的Columns进行分栏时，会有如下问题。

打印网页时，最后一页的显示会出现左边一半内容，右边一半内容的情况，不符合“先左再右”的人类视角。

使用CSS3的Columns进行分栏后，打印网页时，无法完美的进行智能分栏，不能充分利用纸张空间。

CSS3的Columns是在CSS3标准引入的，一些较老的浏览器或第三方工具无法使用它；无法与CSS3支持不够的第三方工具(例如wkhtmltopdf)进行结合。

发明内容

本发明的目的在于克服现有技术的不足，提供一种智能分栏方法及系统，实现了不基于CSS3 Columns的分栏，实现人类视角下的分栏；同时最大幅度的利用纸张空间；可与不支持CSS3的第三方工具进行结合使用。

本发明的目的是通过以下技术方案来实现的：

一种智能分栏方法，包括以下步骤：

S1：将所有待分栏的内容装入原始DIV中，所述原始DIV的宽度为栏宽度，所述原始DIV的高度不限；

S2：依次从原始DIV中取出原始DOM节点并将原始DOM节点逐个放入一个或多个高度为栏高度的分栏子DIV中的一个，如果当前的分栏子DIV不足以容纳原始DOM节点，则对原始DOM节点按高度进行切割并分配到分栏子DIV。

进一步，所述步骤S2中依次从原始DIV中取出原始DOM节点后进行以下子步骤；

S201：判断当前的分栏子DIV是否已满，如果当前的分栏子DIV已满，则顺延下一分栏子DIV；

S202：判断当前的分栏子DIV是否能容纳原始DOM节点；

S203：如果当前的分栏子DIV能容纳原始DOM节点，则将原始DOM节点放入当前的分栏子DIV；如果当前的分栏子DIV不能容纳原始DOM节点，则按高度自原始DOM节点切割出当前的分栏子DIV正好容纳的DOM切割节点，将DOM切割节点放入当前的分栏子DIV并顺延下一分栏子DIV，对切割后的原始DOM节点继续执行步骤S201-S203的操作。

进一步，所述步骤S203中对原始DOM节点进行切割时，DOM切割节点的高度＝当前的分栏子DIV剩余的高度。

进一步，所述步骤S203中对原始DOM节点进行切割时以原始DOM节点的子DOM节点为单位进行切割。

进一步，所述步骤S203中对原始DOM节点进行切割的操作包括以下子步骤：

(1)创建前页DIV与后页DIV；