一种html文档分页排版方法【
技术领域：
】[0001]本发明涉及数字阅读领域，尤其涉及一种HTML文档分页排版方法。【
背景技术：
】[0002]在数字阅读领域有很多基于WEB的阅读场景，在这些场景中，需要对数字阅读内容文件进行解析并呈现，且需要保持原版式以保证效果。移动阅读工具在HTML文档显示过程中，目前大多厂商对这些文档进行解析时为了分页排版，分别对支持的层叠样式表(CSS)进行了裁剪，但这只支持非常少的CSS，这样就在显示该文档时无法还原图书的美观效果，降低了阅读体验。另外一种方式是通过本地的应用程序对HTML文档进行分页并展示，虽然在观看效果上得到改善，但操作繁琐，不利于用户使用。【
发明内容】[0003](一)要解决的技术问题[0004]本发明的目的在于，提供一种HTML文档分页排版方法，无需本地安装应用程序，使用浏览器就能对HTML文档进行分页并展示，并且能呈现美观的展示效果。[0005](二)技术方案[0006]本发明提供一种HTML文档分页排版方法，包括:[0007]SI，将HTML文档载入到浏览器，并将HTML文档内容存储于文档对象模型中；[0008]S2，根据HTML文档内容的显示位置，采用JavaScript脚本对HTML文档内容进行分页排版。[0009](三)有益效果[0010]本发明提供的HTML文档分页排版方法，采用JavaScript脚本对HTML文档内容进行分页排版，能对文档中所有内容进行分页展示，并且分页展示无需安装应用程序，直接通过浏览器就可实现。【附图说明】[0011]图1是本发明实施例提供的HTML文档分页排版方法的流程图。[0012]图2是本发明实施例提供的JavaScript脚本的工作流程图。【具体实施方式】[0013]本发明提供一种HTML文档分页排版方法，先采用浏览器将HTML文档内容存储于文档对象模型(DOM)中，再根据HTML文档内容的显示位置，采用JavaScript脚本对HTML文档内容进行分页排版。[0014]在一种实施方式中，采用JavaScript脚本对HTML文档内容进行分页排版包括:在页面创建一个隐藏的DIV元素，用于存储HTML文档的每一页内容；在01￥元素中，创建多个容器，每个容器用于容纳一页内容；从HTML文档的根元素开始，遍历所述HTML文档中的元素，判断元素是否满足预定条件，若不满足预定条件，则遍历下一层的元素，否则，判断当前容器内元素的高度加上元素的高度是否超过当前容器的高度，若没有超过，则将元素加入到当前容器中，否则将元素加入到下一页容器中；遍历每一层的元素，直到将所述HTML文档的所有元素处理完，得到最终的分页内容。[0015]在一种实施方式中，在分页排版之前，采用JavaScript脚本对HTML文档内容进行预处理，将浏览器无法展示的HTML元素以及无法支持的CSS样式清除。[0016]在一种实施方式中，预定条件为元素是预定标签且元素没有子元素。[0017]在一种实施方式中，预定标签包括表格标签、段落标签、无序列表标签、定义列表标签和标题标签。[0018]在一种实施方式中，判断当前容器内元素的高度加上元素的高度是否超过当前容器的高度，若没有超过，则将元素加入到当前容器中，并标记当前容器还可以承载更多的元素；若当前容器内元素的高度加上元素的高度超过当前容器的高度，将元素同时加入到当前容器及下一页容器中，通过当前容器显示元素的第一部分，通过下一页容器显示元素的第二部分，其中，第一部分的高度为当前容器的剩余高度，第二部分的高度等于元素的高度减去第一部分的高度。[0019]在一种实施方式中，DIV元素的宽度等于屏幕宽度，这里的屏幕是指用户使用的终端的屏幕，如手机、笔记本电脑和平板电脑。[0020]在一种实施方式中，容器的宽度等于DIV元素的宽度，容器的高度等于屏幕的高度。[0021]本发明提供的HTML文档分页排版方法，能对文档中所有内容进行分页展示，并且分页展示无需安装应用程序，直接通过浏览器就可实现。[0022]为使本发明的目的、技术方案和优点更加清楚明白，以下结合具体实施例，并参照附图，对本发明进一步详细说明。[0023]图1是本发明实施例提供的HTML文档分页排版方法，如图1所示，方法包括:[0024]SI，将HTML文档载入到浏览器，并将HTML文档内容存储于文档对象模型(DOM)中，此时浏览器会加载HTML其中的图片、表格、数学公式等，并解析其结构；[0025]S2，根据HTML文档内容的显示位置，采用JavaScript脚本对HTML文档内容进行分页排版。[0026]图2是本发明实施例提供的JavaScript脚本的工作流程图，如图2所示，步骤S2包括:[0027]S21，在页面创建一个隐藏的DIV元素，用于存储HTML文档的每一页内容，其中，DIV是CSS中的定位技术，也可以称其为图层，DIV元素的宽度等于手机屏幕宽度。[0028]S22，在DIV元素中，创建多个容器，每个容器用于容纳HTML文档的一页内容，每个器的宽度等于DIV元素的宽度，容器的高度等于手机屏幕的高度。[0029]S23，由于文档对象模型是一个树形结构，故从HTML文档的根元素根元素开始，遍历HTML文档中的元素，判断元素是否满足预定条件，若不满足预定条件，则遍历下一层的元素，否则，进行下一步骤；其中，预定条件为元素是预定标签且元素没有子元素，预定标签包括表格标签table、段落标签p、无序列表标签ul、定义列表标签dl和标题标签hi?h6。[0030]S24，并标记当前容器还可以承载更多的元素。若已经超过了，仍然将当前元素当前容器(每个容器都设置成超出容器部分隐藏CSS样式:0Verfl0W:hidden)，然后计算当前容器供呈现还剩余的高度以及当前元素的行高，通过剩余高度除以当前元素行高并取整，得到当前页面还能展示行数，记为X行。[0031]将当前元素加入下一页的容器中，并利用CSS样式(margin-top:需隐藏的高度)，隐藏当前元素的X行高度。进入下一个步骤。判断当前容器内元素的高度加上元素的高度是否超过当前容器的高度，若没有超过，则将元素加入到当前容器中，并标记当前容器还可以承载更多的元素；若当前容器内元素的高度加上元素的高度超过当前容器的高度，仍将当前元素加入到当前容器中，其中，每个容器都设置成超出容器部分隐藏CSS样式，将当前容器剩余高度除以当前元素行高并取整，得到当前页面还能展示行数，记为X行，同时，将当前元素加入下一页的容器中，并利用CSS样式隐藏当前元素的X行高度。[0032]S25，循环S23至S24，直到将HTML文档的所有元素处理完，得到最终的分页内容。[0033]在分页排版之前，采用JavaScript脚本对HTML文档内容进行预处理，将浏览器无法展示的HTML元素以及无法支持的CSS样式清除，防止页面无法展示。[0034]本发明提供的HTML文档分页排版方法，采用JavaScript脚本对HTML文档内容进行分页排版，能对文档中所有内容进行分页展示，并且分页展示无需安装应用程序，直接通过浏览器就可实现。[0035]以上所述的具体实施例，对本发明的目的、技术方案和有益效果进行了进一步详细说明，所应理解的是，以上所述仅为本发明的具体实施例而已，并不用于限制本发明，凡在本发明的精神和原则之内，所做的任何修改、等同替换、改进等，均应包含在本发明的保护范围之内。【主权项】1.一种HTML文档分页排版方法，其特征在于，包括:SI，将HTML文档载入到浏览器，并将所述HTML文档内容存储于文档对象模型中；S2，根据所述HTML文档内容的显示位置，采用JavaScript脚本对所述HTML文档内容进行分页排版。2.根据权利要求1所述的HTML文档分页排版方法，其特征在于，所述步骤S2包括:S21，在页面创建一个隐藏的DIV元素，用于存储所述HTML文档的每一页内容；S22，在所述DIV元素中，创建多个容器，每个容器用于容纳所述HTML文档的一页内容；S23，从所述HTML文档的根元素开始，遍历所述HTML文档中的元素，判断所述元素是否满足预定条件，若不满足预定条件，则对所述元素的子元素进行分析，否则，进行下一步骤；S24，判断所述当前容器内元素的高度加上所述元素的高度是否超过所述当前容器的高度，若没有超过，则将所述元素加入到所述当前容器中，否则将所述元素加入到下一页容器中；S25，循环S23至S24，直到将所述HTML文档的所有元素处理完，得到最终的分页内容。3.根据权利要求2所述的HTML文档分页排版方法，其特征在于，在所述步骤S21之前，还包括:采用JavaScript脚本对HTML文档内容进行预处理，将浏览器无法展示的HTML元素以及无法支持的CSS样式清除。4.根据权利要求2所述的HTML文档分页排版方法，其特征在于，所述步骤S23中，所述预定条件为:所述元素是预定标签或者所述元素没有子元素。5.根据权利要求4所述的HTML文档分页排版方法，其特征在于，所述预定标签包括表格标签、段落标签、无序列表标签、定义列表标签和标题标签。6.根据权利要求2所述的HTML文档分页排版方法，其特征在于，所述步骤S24包括:判断所述当前容器内元素的高度加上所述元素的高度是否超过当前容器的高度，若没有超过，则将元素加入到当前容器中，并标记当前容器还可以承载更多的元素；若所述当前容器内元素的高度加上元素的高度超过所述当前容器的高度，将所述元素同时加入到所述当前容器及下一页容器中，通过所述当前容器显示所述元素的第一部分，通过所述下一页容器显示所述元素的第二部分，其中，所述第一部分的高度为所述当前容器的剩余高度，所述第二部分的高度等于所述元素的高度减去所述第一部分的高度。7.根据权利要求2所述的HTML文档分页排版方法，其特征在于，所述DIV元素的宽度等于屏幕宽度。8.根据权利要求7所述的HTML文档分页排版方法，其特征在于，所述容器的宽度等于所述DIV元素的宽度，所述容器的高度等于所述屏幕的高度。【专利摘要】本发明公开了一种HTML文档分页排版方法，先将HTML文档载入到浏览器，并将HTML文档内容存储于文档对象模型(DOM)中，再根据HTML文档内容的显示位置，采用JavaScript脚本对HTML文档内容进行分页排版。本发明能对文档中所有内容进行分页展示，并且分页展示无需安装应用程序，直接通过浏览器就可实现。【IPC分类】G06F17/30,G06F17/25【公开号】CN105069060【申请号】CN201510450955【发明人】莫文【申请人】北京京东尚科信息技术有限公司,北京京东世纪贸易有限公司【公开日】2015年11月18日【申请日】2015年7月28日