CN116431945A - 一种智能分栏方法及系统 - Google Patents

一种智能分栏方法及系统 Download PDF

Info

Publication number
CN116431945A
CN116431945A CN202310254233.3A CN202310254233A CN116431945A CN 116431945 A CN116431945 A CN 116431945A CN 202310254233 A CN202310254233 A CN 202310254233A CN 116431945 A CN116431945 A CN 116431945A
Authority
CN
China
Prior art keywords
div
sub
column
original
dom
Prior art date
Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
Pending
Application number
CN202310254233.3A
Other languages
English (en)
Inventor
易洪宇
李黎明
唐晋义
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Sichuan Shengxue Education Technology Co ltd
Original Assignee
Sichuan Shengxue Education Technology Co ltd
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by Sichuan Shengxue Education Technology Co ltd filed Critical Sichuan Shengxue Education Technology Co ltd
Priority to CN202310254233.3A priority Critical patent/CN116431945A/zh
Publication of CN116431945A publication Critical patent/CN116431945A/zh
Pending legal-status Critical Current

Links

Images

Classifications

    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/90—Details of database functions independent of the retrieved data types
    • G06F16/95—Retrieval from the web
    • G06F16/957—Browsing optimisation, e.g. caching or content distillation
    • G06F16/9577—Optimising the visualization of content, e.g. distillation of HTML documents
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F9/00—Arrangements for program control, e.g. control units
    • G06F9/06—Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
    • G06F9/44—Arrangements for executing specific programs
    • G06F9/451—Execution arrangements for user interfaces

Landscapes

  • Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • Software Systems (AREA)
  • Databases & Information Systems (AREA)
  • Physics & Mathematics (AREA)
  • General Engineering & Computer Science (AREA)
  • General Physics & Mathematics (AREA)
  • Data Mining & Analysis (AREA)
  • Human Computer Interaction (AREA)
  • Document Processing Apparatus (AREA)

Abstract

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

Description

一种智能分栏方法及系统
技术领域
本发明涉及分栏领域，特别是一种智能分栏方法及系统。
背景技术
网页分栏是指将网页的宽度等分成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；
(2)将原始DOM节点放入前页DIV；
(3)自前页DIV中的DOM节点的最末尾依次将所述子DOM节点移动到后页DIV中，直至当前的分栏子DIV正好容纳前页DIV中的DOM节点；前页DIV中的DOM节点即为DOM切割节点，后页DIV中的DOM节点即为切割后的原始DOM节点。
进一步，所述步骤S203中以原始DOM节点的所述子DOM节点为单位进行切割时出现临界子DOM节点时，对临界子DOM节点进行切割；
所述临界子DOM节点在当前的分栏子DIV中无法容纳但临界子DOM节点不放入当前的分栏子DIV时当前的分栏子DIV有空间剩余。
进一步，所述临界子DOM节点为文字，则对临界子DOM节点的切割采用二分切割。
进一步，所述分栏子DIV的创建方式包括新建与再建。
一种智能分栏系统，用于实现上述一种智能分栏方法，包括数据接收接口、数据处理中心以及数据输出接口，所述数据接收接口接收所有待分栏的内容，所述数据处理中心对所有待分栏的内容进行处理得到分栏子DIV的信息，所述数据输出接口输出分栏子DIV的信息。
本发明的有益效果是：
通过基于HTML DOM结构动态调整，实现了不基于CSS3 Columns的分栏，实现对最后一页在“先左再右”的人类视角下的分栏；同时最大幅度的利用纸张空间，节省资源，避免浪费；可与不支持CSS3的第三方工具进行结合使用。
附图说明
图1为使用CSS3 Columns分栏打印的最后一页的效果图；
图2为从左到右排列的“先左再右”的人类视角下的分栏效果图；
图3为使用CSS3 Columns分栏可能出现的空间浪费效果图；
图4为本发明分栏完成后的示例图；
图5为本发明的总流程图。
具体实施方式
以下通过特定的具体实例说明本发明的实施方式，本领域技术人员可由本说明书所揭露的内容轻易地了解本发明的其他优点与功效。本发明还可以通过另外不同的具体实施方式加以实施或应用，本说明书中的各项细节也可以基于不同观点与应用，在没有背离本发明的精神下进行各种修饰或改变。需说明的是，在不冲突的情况下，以下实施例及实施例中的特征可以相互组合。
需要说明的是，以下实施例中所提供的图示仅以示意方式说明本发明的基本构想，遂图式中仅显示与本发明中有关的组件而非按照实际实施时的组件数目、形状及尺寸绘制，其实际实施时各组件的型态、数量及比例可为一种随意的改变，且其组件布局型态也可能更为复杂。
实施例一：
如图1至图5所示，一种智能分栏方法，包括以下步骤：
S1：将所有待分栏的内容装入原始DIV中，所述原始DIV的宽度为栏宽度，所述原始DIV的高度不限；
所有待分栏的内容位于HTML DOM节点中。
栏宽度为分栏得到的栏的宽度。栏宽度可为页宽度的1/N，N为分栏数目，分栏数目可通过输入设置，栏宽度也可根据分栏数目结合栏与栏之间的间距确定。
如果N等于2，则是将所有待分栏的内容装在一个宽度为半页款的原始DIV(即ORG_DIV)中。
ORG_DIV仅为分栏过程的中间容器，先把所有内容装进去，再一个一个的取出来。
S2：依次从原始DIV中取出原始DOM节点并将原始DOM节点逐个放入一个或多个高度为栏高度的分栏子DIV中的一个，如果当前的分栏子DIV不足以容纳原始DOM节点，则对原始DOM节点按高度进行切割并分配到分栏子DIV；
一个分栏子DIV即对应于页面的一栏，其中栏高度可为页高度，也可为页面的内容高度。此处的分栏子DIV即为最终输出，每N个分栏子DIV设于一个页面。
多个分栏子DIV中，每N个分栏子DIV属于一个页DIV。页DIV对应于一个页面。一个页DIV下的N个分栏子DIV的布局可使用绝对定位布局。
分栏子DIV按从左到右顺序排列。
所述分栏子DIV的创建方式包括新建与再建。
新建时，可系统设置，也可用户设定。
所述分栏子DIV不足，则创建新的分栏子DIV。
具体地，若最后一个分栏子DIV也放不下了，就创建新的页DIV(其中包含N个分栏子DIV)，直到ORG_DIV中的子节点被全部取出。
原始DOM节点为即步骤S1中装入原始DIV中的原HTML DOM节点。
将原始DOM节点放入分栏子DIV中。按从左至右的顺序，若第一个分栏子DIV放不下了，就放入第二个分栏子DIV；若第二个分栏子DIV放不下了，就放第三个分栏子DIV，依次类推。若最后一个分栏子DIV也放不下了，则再次新建多个高度为栏高度的分栏子DIV，直到ORG_DIV中的原始DOM节点被全部取出。
所述步骤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剩余的高度。
举例说明，如果原始DOM节点的高度为90，而当前的分栏子DIV剩余的高度仅为60，则要对原始DOM节点进行切割，切割得到的第二DOM节点的高度为60，当前的分栏子DIV正好能够容纳，第一DOM节点的高度为30。
所述步骤S203中对原始DOM节点进行切割时以原始DOM节点的子DOM节点为单位进行切割。
所述步骤S203中对原始DOM节点进行切割的操作包括以下子步骤：
(1)创建前页DIV与后页DIV；
(2)将原始DOM节点放入前页DIV；
(3)自前页DIV中的DOM节点的最末尾依次将所述子DOM节点移动到后页DIV中，直至当前的分栏子DIV正好容纳前页DIV中的DOM节点；前页DIV中的DOM节点即为DOM切割节点，后页DIV中的DOM节点即为切割后的原始DOM节点。
所述步骤S203中以原始DOM节点的所述子DOM节点为单位进行切割时出现临界子DOM节点时，对临界子DOM节点进行切割；
所述临界子DOM节点在当前的分栏子DIV中无法容纳但临界子DOM节点不放入当前的分栏子DIV时当前的分栏子DIV有空间剩余。
也就是说，如果临界子DOM节点本身的高度无法完美切割，则对临界子DOM节点进行切割。
具体的，临界子DOM节点是指移动到某子DOM节点时，这个子DOM节点如果放入步骤(1)创建的后页DIV，则DOM切割节点在当前的分栏子DIV内的高度能满足，但是还剩一些空间，如果不放入，高度就不满足(会超出当前的分栏子DIV的高度)。
所述临界子DOM节点为文字，则对临界子DOM节点的切割采用二分切割。
如果临界子DOM节点本身是文本，没有子DOM节点，则进行二分切割，直到满足条件为止。二分切割是指先切文本的一半(按文本长度)，看看高度是否满足，若不满足，再切一半的一半，直到高度满足为止。
对临界子DOM节点的切割是一个递归过程，如果不满足条件，会对孙子DOM节点再进行切割，直到满足条件为止。
将所有ORG_DIV中的内容完全装入到新创建的分栏子DIV中后，删除ORG_DIV节点。
一种智能分栏系统，用于实现上述一种智能分栏方法，包括数据接收接口、数据处理中心以及数据输出接口，所述数据接收接口接收所有待分栏的内容，所述数据处理中心对所有待分栏的内容进行处理得到分栏子DIV的信息，所述数据输出接口输出分栏子DIV的信息。
无需CSS3支持。在分栏过程中进行DOM节点宽高、位置计算，用类似搭积木的方式，将需要分栏的内容(DOM节点)依次放于事先创建好的分栏子DIV中。
通过基于HTML DOM结构动态调整，实现了不基于CSS3 Columns的分栏，实现对最后一页在“先左再右”的人类视角下的分栏；同时最大幅度的利用纸张空间，节省资源，避免浪费；可与不支持CSS3的第三方工具进行结合使用。
以上所述实施例仅表达了本发明的具体实施方式，其描述较为具体和详细，但并不能因此而理解为对本发明专利范围的限制。应当指出的是，对于本领域的普通技术人员来说，在不脱离本发明构思的前提下，还可以做出若干变形和改进，这些都属于本发明的保护范围。

Claims (9)

1.一种智能分栏方法，其特征在于：包括以下步骤：
S1：将所有待分栏的内容装入原始DIV中，所述原始DIV的宽度为栏宽度，所述原始DIV的高度不限；
S2：依次从原始DIV中取出原始DOM节点并将原始DOM节点逐个放入一个或多个高度为栏高度的分栏子DIV中的一个，如果当前的分栏子DIV不足以容纳原始DOM节点，则对原始DOM节点按高度进行切割并分配到分栏子DIV。
2.根据权利要求1所述的一种智能分栏方法，其特征在于：
所述步骤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的操作。
3.根据权利要求2所述的一种智能分栏方法，其特征在于：
所述步骤S203中对原始DOM节点进行切割时，DOM切割节点的高度＝当前的分栏子DIV剩余的高度。
4.根据权利要求2所述的一种智能分栏方法，其特征在于：
所述步骤S203中对原始DOM节点进行切割时以原始DOM节点的子DOM节点为单位进行切割。
5.根据权利要求4所述的一种智能分栏方法，其特征在于：
所述步骤S203中对原始DOM节点进行切割的操作包括以下子步骤：
(1)创建前页DIV与后页DIV；
(2)将原始DOM节点放入前页DIV；
(3)自前页DIV中的DOM节点的最末尾依次将所述子DOM节点移动到后页DIV中，直至当前的分栏子DIV正好容纳前页DIV中的DOM节点；前页DIV中的DOM节点即为DOM切割节点，后页DIV中的DOM节点即为切割后的原始DOM节点。
6.根据权利要求4所述的一种智能分栏方法，其特征在于：
所述步骤S203中以原始DOM节点的所述子DOM节点为单位进行切割时出现临界子DOM节点时，对临界子DOM节点进行切割；
所述临界子DOM节点在当前的分栏子DIV中无法容纳但临界子DOM节点不放入当前的分栏子DIV时当前的分栏子DIV有空间剩余。
7.根据权利要求6所述的一种智能分栏方法，其特征在于：
所述临界子DOM节点为文字，则对临界子DOM节点的切割采用二分切割。
8.根据权利要求1所述的一种智能分栏方法，其特征在于：
所述分栏子DIV的创建方式包括新建与再建。
9.一种智能分栏系统，用于实现权利要求1-8中任一权利要求所述的一种智能分栏方法，其特征在于：
包括数据接收接口、数据处理中心以及数据输出接口，所述数据接收接口接收所有待分栏的内容，所述数据处理中心对所有待分栏的内容进行处理得到分栏子DIV的信息，所述数据输出接口输出分栏子DIV的信息。
CN202310254233.3A 2023-03-16 2023-03-16 一种智能分栏方法及系统 Pending CN116431945A (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN202310254233.3A CN116431945A (zh) 2023-03-16 2023-03-16 一种智能分栏方法及系统

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN202310254233.3A CN116431945A (zh) 2023-03-16 2023-03-16 一种智能分栏方法及系统

Publications (1)

Publication Number Publication Date
CN116431945A true CN116431945A (zh) 2023-07-14

Family

ID=87091729

Family Applications (1)

Application Number Title Priority Date Filing Date
CN202310254233.3A Pending CN116431945A (zh) 2023-03-16 2023-03-16 一种智能分栏方法及系统

Country Status (1)

Country Link
CN (1) CN116431945A (zh)

Citations (2)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN102262627A (zh) * 2010-05-24 2011-11-30 卓望数码技术（深圳）有限公司 一种网页分割方法和网页分割系统
CN105069060A (zh) * 2015-07-28 2015-11-18 北京京东尚科信息技术有限公司 一种html文档分页排版方法

Patent Citations (2)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN102262627A (zh) * 2010-05-24 2011-11-30 卓望数码技术（深圳）有限公司 一种网页分割方法和网页分割系统
CN105069060A (zh) * 2015-07-28 2015-11-18 北京京东尚科信息技术有限公司 一种html文档分页排版方法

Non-Patent Citations (1)

* Cited by examiner, † Cited by third party
Title
周建;汤进;罗斌;: "基于DOM结构树的网页正文信息分段方法", 计算机与现代化, no. 10, 22 October 2013 (2013-10-22), pages 233 - 236 *

Similar Documents

Publication Publication Date Title
US7853869B2 (en) Creation of semantic objects for providing logical structure to markup language representations of documents
RU2419856C2 (ru) Различные виды оформления с гармоничной версткой для динамически агрегированных документов
US7984076B2 (en) Document processing apparatus, document processing method, document processing program and recording medium
US6088708A (en) System and method for creating an online table from a layout of objects
US20010014900A1 (en) Method and system for separating content and layout of formatted objects
JP4965118B2 (ja) 複数コラムのレイアウトを生成する方法およびコンピュータ読取り可能媒体
CN102779118B (zh) 一种论文的排版方法及系统
CN102612690B (zh) 支持文档的与平台无关的排版
CN110705237B (zh) 文档的自动生成方法、数据处理设备及存储介质
US7596752B2 (en) Delaying optimal paragraph layout during editing
CN110705503A (zh) 生成目录结构化信息的方法和装置
JP2000039948A (ja) オブジェクト配置制御装置、方法及び記録媒体
CN111444452B (zh) 网页页面的转换方法、装置及存储介质
CN111126007B (zh) 一种基于html病历文书分页算法
CN107656908B (zh) 占位符的实现方法和系统
CN104516868A (zh) 一种版面空格的流式还原方法与系统
CN109783792A (zh) 图文排版方法及装置
CN112433995A (zh) 文件格式转换方法、系统、计算机设备及存储介质
CN116431945A (zh) 一种智能分栏方法及系统
CN104077292B (zh) 网页信息的存储方法及设备
CN115587075A (zh) 版式文件处理方法、装置、终端设备及存储介质
CN113011150B (zh) 一种报纸的排版系统及方法
CN115114556A (zh) 一种创建页面的方法和装置
CN114218418A (zh) 一种对多种类型文件进行矢量编辑设计的方法
JP3115059B2 (ja) 構造化文書編集方法

Legal Events

Date Code Title Description
PB01 Publication
PB01 Publication
SE01 Entry into force of request for substantive examination
SE01 Entry into force of request for substantive examination