CN103970890B

CN103970890B - 一种实时网页数据的生成方法及装置

Info

Publication number: CN103970890B
Application number: CN201410222095.1A
Authority: CN
Inventors: 游磊青; 黄建雄; 杨凡
Original assignee: Fujian Star Net Communication Co Ltd
Current assignee: Fujian Star Net Communication Co Ltd
Priority date: 2014-05-23
Filing date: 2014-05-23
Publication date: 2017-04-12
Anticipated expiration: 2034-05-23
Also published as: CN103970890A

Abstract

本发明公开一种实时网页数据生成方法，包括步骤：S101、使用DIV标签构建网页模板；S102、生成二维数组格式的数据，所述二维数组格式的数据包括至少一组第一维数据，每组第一维数据包括至少一个第二维数据；S103、根据DIV标签的top、left参数计算网页包含的行列，然后将所述行数据和列数据填入相应的DIV标签中；S104、判断第二维数据的个数是否不同于DIV标签的个数，若不同，则增加或删除DIV标签，然后根据原有行的总宽度，删除或增加后的DIV标签个数对DIV标签的left、width参数进行缩放，计算出DIV标签的新的left、width，并生成最终的网页。本发明公开一种实时网页数据生成装置。

Description

一种实时网页数据的生成方法及装置

技术领域

本发明涉及一种实时网页数据的生成方法及装置。

背景技术

在生成实时变化的网页数据时，通常采用的方案是：为网页模板添加标志位，数据以包含标志位的格式生成后，与网页模板通过标志位进行组合，生成最终的网页，该方案的实例如下：

(1)预先构建网页模板，例如：

其中，${head1}、${head2}、${body1}、${body2}就是预先添加好的标志位；

(2)生成实时变化的数据，可以采用但不限于XML，例如：

上述数据中包含标志位及标志位所对应的数据，生成最终的网页时，只需根据标志位将数据一一地填入网页模板即可，此种情况下如果数据中需要增加head3或者body3之类的数据，就需要同时修改网页模板。

通过上述实例可知，现有的生成实时网页数据的方案因需要建立标志位的对应关系，在数据字段增加或删减时，就需要同时修改网页模板，灵活性差、实时性低。

申请号为：201110047587.8的中国发明专利申请，公开了一种基于XML的金融数据显示方法及系统，所述方法简化了从实时变化的金融数据向静态显示的页面转换的过程，不需要在每次数据更新的时候都重新去根据新的数据编写显示页面，只要定时调用既定显示效果的模板解析即可，方便根据需要更改显示效果。但上述方法中在数据字段实时变化的情况下，需要重新修改，调用既定显示效果的模板。

发明内容

本发明的目的在于提供一种实时网页数据的生成方法及系统，可以在数据字段实时变化的情况下，不需要重新修改网页模板，通过程序自适应，快速生成最终的网页数据。

为实现上述发明目的，本发明采用的一个技术方案是：

提供一种实时网页数据生成方法，其特征在于，包括如下步骤：

S101、使用DIV标签构建网页模板，每个DIV标签对应具有位置参数及属性参数，该位置参数包括top、left；

S102、生成二维数组格式的数据，所述二维数组格式的数据包括至少一组第一维数据，每组第一维数据包括至少一个第二维数据，第一维数据为网页中的行数据，第二维数据为相应行中的列数据；

S103、根据DIV标签的top、left参数计算网页包含的行列，其中，top值相同的为同一行，对相同top值的DIV标签以left值的大小排序不同列，然后按照行数据对应top参数，列数据对应left参数的规则，将所述行数据和列数据填入相应的DIV标签中；以及

S104、判断第二维数据的个数是否不同于DIV标签的个数，若不同，则增加或删除DIV标签，然后根据行的宽度以及删除或增加后的DIV标签个数对DIV标签的left、width参数进行缩放，计算出DIV标签的新的left、width，并生成最终的网页。

本发明采用的另一个技术方案是：

提供一种实时网页数据生成装置，包括：

模板构建模块，用于使用DIV标签构建网页模板，每个DIV标签对应具有位置参数及属性参数，该位置参数包括top、left；

二维数组数据生成模块，用于生成二维数组格式的数据，所述二维数组格式的数据包括至少一组第一维数据，每组第一维数据包括至少一个第二维数据，第一维数据为网页中的行数据，第二维数据为相应行中的列数据；

数据填入模块，用于根据DIV标签的top、left参数计算网页包含的行列，其中，top值相同的为同一行，对相同top值的DIV标签以left值的大小排序不同列，然后按照行数据对应top参数，列数据对应left参数的规则，将所述行数据和列数据填入相应的DIV标签中；

位置参数调整模块，用于判断第二维数据的个数是否不同于DIV标签的个数，若不同，则增加或删除DIV标签，然后根据行的宽度以及删除或增加后的DIV标签个数对DIV标签的left、width参数进行缩放，计算出DIV标签的新的left、width，并生成最终的网页。

本发明的实时网页数据生成装置及方法，网页模板采用DIV标签，并采用绝对定位的方式，数据则以二维数组的格式生成；组合网页模板与数据时，首先通过DIV的绝对定位位置进行计算，得出网页模板的行列，再循环数据的数组，将数据内容填入各DIV中，在数据字段数改变时，自动根据改变后的个数，在网页对应的行中，增加或删减DIV，并重新计算各DIV的绝对位置，生成最终的网页；实现在数据字段实时变化的情况下，不需要重新修改网页模板，通过程序自适应，快速生成最终的网页内容。

附图说明

图1是本发明一实施方式中一种实时网页数据生成方法的执行流程图；

图2为一实例中的网页示意图。

具体实施方式

为详细说明本发明的技术内容、构造特征、所实现目的及效果，以下结合实施方式并配合附图详予说明。

为清楚的阐述本发明的实施方式，首先对本发明所涉及的专有名词加以说明：

DIV：DIV标签是HTML的一种通用标签，作用是定义页面中的分区或节，把页面分割为独立的、不同的部分，为HTML文档内大块(block-level)的内容提供结构和背景的元素。DIV的起始标签和结束标签之间的所有内容都是用来构成这个块的，其中所包含元素的特性由DIV标签的属性来控制，或者是通过使用样式表格式化这个块来进行控制。DIV标签称为区隔标记。作用：设定字、画、表格等的摆放位置。当你把文字，图像，或其他的放在DIV中，它可称作为“DIV block”，或“DIV element”或“CSS-layer”，或干脆叫“layer”。而中文我们把它称作“层次”。

绝对定位：DIV的绝对定位就是通过top、left参数固定DIV相对于播放区域左上角的位置，例如，H4{；left:100px；top:43px}这项CSS规则让浏览器将<H4>的起始位置精确地定在距离浏览器左边100象素，距离其顶部43象素的位置，这里唯一设置了的是左边和顶部，也就说，文字将从左到右，从上到下载入浏览窗口。

请参阅图1，是本发明一实施方式中一种实时网页数据生成方法的执行流程图。需要说明的是，“S101”等标识仅作为步骤的区分，其并不对步骤先后顺序作限定，步骤执行的先后依照方案中信息流或信号流的实质为准。

所述实时网页数据生成方法包括如下步骤：

步骤S101、使用DIV标签构建网页模板，每个DIV标签对应具有位置参数及属性参数，该位置参数包括top、left。其中，top表示DIV距离播放区上边缘的距离，left表示DIV距离播放区左边缘的距离，width表示DIV的宽度，height表示DIV的高度。属性参数包括图片区、或文字单元格等，DIV的位置参数及属性参数的具体数值根据实际网页要展示的效果而定，例如，在本实例中构建网页模版：

在属性参数中，background表示该区域的背景色，alpha表示背景色透明度，font-name表示该区域中文字的字体，font-size表示文字大小，color表示文字颜色，text-alpha表示文字透明度，text-align表示文字的对齐方式，top值相同的DIV即为网页中的同一行。

步骤S102、生成二维数组格式的数据，所述二维数组格式的数据包括至少一组第一维数据，每组第一维数据包括至少一个第二维数据，第一维数据为网页中的行数据，第二维数据为相应行中的列数据。例如，二维数组{[["品种","价格","单位"],["黄金","324","元"],["白金","368","元"]]}表示网页有三行数据，每行有三个单元格且每个单元格即为一个列数据，第一行数据为"品种","价格","单位"，第二行数据为"黄金","324","元"，第三行数据为"白金","368","元"。

步骤S103、根据DIV标签的top、left参数计算网页包含的行列，其中，top值相同的为同一行，对相同top值的DIV标签以left值的大小排序不同列，然后按照行数据对应top参数，列数据对应left参数的规则，将所述行数据和列数据填入相应的DIV标签中。

其中，所述步骤S103具体包括如下步骤：

步骤S1031、遍历所有的DIV标签，读取DIV标签的top值，top值相同的DIV标签表示在网页中为同一行。

步骤S1032、对不同的top值进行排序，将top值由小到大地依次对应网页中的第一行至最后一行。

步骤S1033、对top值相同的DIV标签的left值进行排序，将left值由小到大地依次对应网页中相应行的第一列至最后一列。

步骤S1034、将二维数组格式的数据行数据中的列数据填入具有相应top值和left值的DIV标签中。

其中，所述“判断第二维数据的个数是否不同于DIV标签的个数，若不同，则增加或删除DIV标签”具体为：判断第二维数据的个数是否小于或大于对应行的DIV标签的个数，若小于，则按照left值由大到小地删除对应行的DIV标签直至等于第二维数据的个数，若大于，则按照left值由小到大地增加对应行的DIV标签直至等于第二维数据的个数。

请参阅图2，为一实例中的网页示意图。二维数组格式的数据如下：

{[["外汇牌价"],

["以下价格仅供参考,以实际交易价格为准(2014-01-10)"],

["货币名称","现汇买入价","现钞买入价","卖出价","基准价"],

["澳大利亚元","536.81","520.25","540.59","540.59"],

["加拿大元","555.87","538.71","560.33","560.33"],

["瑞士法郎","664.46","643.95","669.8","669.8"],

]}

网页模板中，top值为0的DIV是网页第一行，仅一个，对应填入数据的第一行"外汇牌价"，top值为50的DIV是网页第二行，仅一个，对应填入数据的第二行"以下价格仅供参考,以实际交易价格为准(2014-01-10)]"，top值为100的是网页第三行，共5个，分别填入数据第三行中的"货币名称","现汇买入价","现钞买入价","卖出价","基准价"，以此类推。

本发明还提供一种实时网页数据生成装置，所述实时网页数据生成方法应用于该实时网页数据生成装置中。该实时网页数据生成装置包括模板构建模块、二维数组数据生成模块、数据填入模块、位置参数调整模块。

模板构建模块用于使用DIV标签构建网页模板，每个DIV标签对应具有位置参数及属性参数，该位置参数包括top、left。二维数组数据生成模块用于生成二维数组格式的数据，所述二维数组格式的数据包括至少一组第一维数据，每组第一维数据包括至少一个第二维数据，第一维数据为网页中的行数据，第二维数据为相应行中的列数据。数据填入模块用于根据DIV标签的top、left参数计算网页包含的行列，其中，top值相同的为同一行，对相同top值的DIV标签以left值的大小排序不同列，然后按照行数据对应top参数，列数据对应left参数的规则，将所述行数据和列数据填入相应的DIV标签中。位置参数调整模块用于判断第二维数据的个数是否不同于DIV标签的个数，若不同，则增加或删除DIV标签，然后根据行的宽度以及删除或增加后的DIV标签个数对DIV标签的left、width参数进行缩放，计算出DIV标签的新的left、width，并生成最终的网页。

在本实施方式中，所述位置参数调整模块在执行所述“判断第二维数据的个数是否不同于DIV标签的个数，若不同，则增加或删除DIV标签”时，具体用于判断第二维数据的个数是否小于或大于对应行的DIV标签的个数，若小于，则按照left值由大到小地删除对应行的DIV标签直至等于第二维数据的个数，若大于，则按照left值由小到大地增加对应行的DIV标签直至等于第二维数据的个数。

在本实施方式中，所述数据填入模块具体包括遍历模块、第一排序模块、第二排序模块。遍历模块用于遍历所有的DIV标签，读取DIV标签的top值，top值相同的DIV标签表示在网页中为同一行。第一排序模块用于对不同的top值进行排序，将top值由小到大地依次对应网页中的第一行至最后一行。第二排序模块用于对top值相同的DIV标签的left值进行排序，将left值由小到大地依次对应网页中相应行的第一列至最后一列。填入模块用于将二维数组格式的数据中行数据中的列数据填入具有相应top值和left值的DIV标签中。

以上所述仅为本发明的实施例，并非因此限制本发明的专利范围，凡是利用本发明说明书及附图内容所作的等效结构或等效流程变换，或直接或间接运用在其他相关的技术领域，均同理包括在本发明的专利保护范围内。

Claims

1.一种实时网页数据生成方法，其特征在于，包括如下步骤：

S104、判断第二维数据的个数是否不同于对应行的DIV标签的个数，若不同，则增加或删除DIV标签，然后根据行的宽度以及删除或增加后的DIV标签个数对DIV标签的left、width参数进行缩放，计算出DIV标签的新的left、width，并生成最终的网页。

2.根据权利要求1所述的一种实时网页数据生成方法，其特征在于，所述“判断第二维数据的个数是否不同于DIV标签的个数，若不同，则增加或删除DIV标签”具体为：

判断第二维数据的个数是否小于或大于对应行的DIV标签的个数，若小于，则按照left值由大到小地删除对应行的DIV标签直至等于第二维数据的个数，若大于，则按照left值由小到大地增加对应行的DIV标签直至等于第二维数据的个数。

3.根据权利要求1所述的一种实时网页数据生成方法，其特征在于，所述步骤S103具体包括如下步骤：

S1031、遍历所有的DIV标签，读取DIV标签的top值，top值相同的DIV标签表示在网页中为同一行；

S1032、对不同的top值进行排序，将top值由小到大地依次对应网页中的第一行至最后一行；

S1033、对top值相同的DIV标签的left值进行排序，将left值由小到大地依次对应网页中相应行的第一列至最后一列；以及

S1034、将二维数组格式的数据中行数据中的列数据填入具有相应top值和left值的DIV标签中。

4.一种实时网页数据生成装置，其特征在于，包括：

数据填入模块，用于根据DIV标签的top、left参数计算网页包含的行列，其中，top值相同的为同一行，对相同top值的DIV标签以left值的大小排序不同列，然后按照行数据对应top参数，列数据对应left参数的规则，将所述行数据和列数据填入相应的DIV标签中；以及

位置参数调整模块，用于判断第二维数据的个数是否不同于对应行的DIV标签的个数，若不同，则增加或删除DIV标签，然后根据行的宽度以及删除或增加后的DIV标签个数对DIV标签的left、width参数进行缩放，计算出DIV标签的新的left、width，并生成最终的网页。

5.根据权利要求4所述的一种实时网页数据生成装置，其特征在于，所述位置参数调整模块在执行所述“判断第二维数据的个数是否不同于DIV标签的个数，若不同，则增加或删除DIV标签”时，具体用于判断第二维数据的个数是否小于或大于对应行的DIV标签的个数，若小于，则按照left值由大到小地删除对应行的DIV标签直至等于第二维数据的个数，若大于，则按照left值由小到大地增加对应行的DIV标签直至等于第二维数据的个数。

6.根据权利要求4所述的一种实时网页数据生成装置，其特征在于，所述数据填入模块具体包括：

遍历模块，用于遍历所有的DIV标签，读取DIV标签的top值，top值相同的DIV标签表示在网页中为同一行；

第一排序模块，用于对不同的top值进行排序，将top值由小到大地依次对应网页中的第一行至最后一行；

第二排序模块，用于对top值相同的DIV标签的left值进行排序，将left值由小到大地依次对应网页中相应行的第一列至最后一列；

填入模块，用于将二维数组格式的数据中行数据中的列数据填入具有相应top值和left值的DIV标签中。