CN102467378A

CN102467378A - 基于二维矩阵的html表格处理方法及计算机

Info

Publication number: CN102467378A
Application number: CN2010105399221A
Authority: CN
Inventors: 罗冠华
Original assignee: SHENZHEN JINDIE YOUSHANG E-BUSINESS SERVICE Co Ltd
Current assignee: SHENZHEN JINDIE YOUSHANG E-BUSINESS SERVICE Co Ltd
Priority date: 2010-11-11
Filing date: 2010-11-11
Publication date: 2012-05-23

Abstract

本发明涉及一种基于二维矩阵的HTML表格处理方法及计算机，该方法包括：解析HTML表格相应的行和列；构造一个二维数组，并将由所述行和列确定的单元格存入所述二维数组对应的位置；选取所述单元格并进行相应的操作。本发明提供的基于二维矩阵的HTML表格处理方法及实现该方法的计算机，将表格构造成一个二维矩阵的二维数组，利用javascript操作HTML表格(增加或删除行、增加或删除列、单元格合并、单元格拆分等)，从而实现一个基于Web的所见即所得的表格设计器，无需第三方的工具来创建和布局页面、可以根据需要调整的页面布局、与应用规范一致，可以根据具体的应用来约束、规范页面的创建过程。

Description

基于二维矩阵的HTML表格处理方法及计算机

技术领域

本发明涉及计算机技术领域，具体是基于二维矩阵的HTML(Hype TextMark-up Language，即超文本标记语言或超文本链接标示语言)表格处理方法及计算机。

背景技术

在Web(网页)应用平台中，为了实现“用户可定制web界面”，往往需要开发一个所见即所得的“界面设计器”，通过“界面设计器”实现界面元素的排列和定位，即界面布局。在web页面中实现元素的布局，可以通过操作表格来实现元素的排列和定位。

一个表格设计器中，需要实现表格的如下操作：1)增加、删除行；2)增加、删除列；3)单元格合并；4)单元格拆分；5)表格嵌套；

现有技术中，通常的做法是利用第三方的页面设计工具，如：Dreamweaver(一种网页设计工具)来制作界面布局的表格页面，通过这类工具来完成表格行、列的增加或删除；单元格的合并与拆分等。将得到的布局页面作为模板保存，web应用程序利用布局模板、结合具体的界面的逻辑定义，最终展示出一个完整的web输入界面。

上述现有技术具有以下缺点：

1、需要使用第三方的工具来创建布局页面，成本较高、且需要额外的学习；

2、无法根据具体应用的需要来约束、规范页面的创建过程；

3、创建的页面经常会与应用规范要求不一致；

4、无法嵌入到应用中，因此不能让用户根据自己的需求来调整界面的布局。

发明内容

本发明的主要目的是提供一种无需第三方的工具来创建和布局页面、可以根据需要调整的页面布局、与应用规范一致的基于二维矩阵的HTML表格处理方法及实现该方法的计算机。

本发明解决其技术问题所采用的技术方案是：

一种基于二维矩阵的HTML表格处理方法，其包括：

解析HTML表格相应的行和列；

构造一个二维数组，并将由所述行和列确定的单元格存入所述二维数组对应的位置；

选取所述单元格并进行相应的操作。

优选的，所述选取所述单元格并进行相应的操作，具体包括：

选取所述单元格并进行增删行列、合并拆分单元格。

优选的，所述选取所述单元格并进行相应的操作，之后还进一步包括：

根据选取的所述单元格所在的行和列找到所述二维数组中的行和列，并以所述进行相应的操作后的单元格作为模板，更新所述HTML表格中的行和列的元素。

优选的，所述更新所述HTML表格中的行和列的元素，之后，进一步包括：

根据所述更新后的HTML表格重构所述二维数组。

本发明还提供一种计算机，其包括：

解析单元，用于解析HTML表格相应的行和列；

存入单元，用于构造一个二维数组，并将由所述行和列确定的单元格存入所述二维数组对应的位置；

操作单元，用于选取所述单元格并进行相应的操作。

优选的，所述操作单元，用于选取所述单元格并进行增删行列、合并拆分单元格。

优选的，所述计算机还包括：更新单元，用于根据选取的所述单元格所在的行和列找到所述二维数组中的行和列，并以所述进行相应的操作后的单元格作为模板，更新所述HTML表格中的行和列的元素。

优选的，所述计算机还包括重构单元，用于根据所述更新后的HTML表格重构所述二维数组。

实施本发明的技术方案，具有以下有益效果：本发明提供的基于二维矩阵的HTML表格处理方法及实现该方法的计算机，将表格构造成一个二维矩阵的二维数组，利用javascript操作HTML表格(增加或删除行、增加或删除列、单元格合并、单元格拆分等)，从而实现一个基于Web的所见即所得的表格设计器，无需第三方的工具来创建和布局页面、可以根据需要调整的页面布局、与应用规范一致，可以根据具体的应用来约束、规范页面的创建过程。

附图说明

图1为本发明实施例提供的方法流程图；

图2为本发明实施例提供的方法的另一流程图；

图3为本发明实施例提供的计算机的结构示意图；

图4为本发明实施例提供的计算机的另一结构示意图。

本发明目的的实现、功能特点及优点将结合实施例，参照附图做进一步说明。

具体实施方式

为了使本发明的目的、技术方案及优点更加清楚明白，以下结合附图及实施例，对本发明进行进一步详细说明。应当理解，此处所描述的具体实施例仅仅用以解释本发明，并不用于限定本发明。

本发明实施例提供一种基于二维矩阵(也称为：二维数组)的HTML表格处理方法，如图1所示，该方法包括步骤：

S110、解析HTML表格相应的行和列；该相应的行和列为需要处理的行和列。

S120、构造一个二维数组(即生成一个二维数组，该数组中包括数组的元素)，并将由所述行和列确定的单元格存入所述二维数组对应的位置；

S130、选取所述单元格并进行相应的操作。具体，该步骤中的相应的操作包括：增删行列、合并拆分单元格等操作。

在其他的实施例中，进一步的，如图2所示，所述步骤S130、选取所述单元格并进行相应的操作，之后还进一步包括步骤：

S140、根据选取的所述单元格的行和列找到所述二维数组中的行和列，并以所述进行相应的操作后的单元格作为模板，更新所述HTML表格中的行和列的元素。在该步骤中需要提取所述二维数组中行和列的元素，并以该提取的所述二维数组中行和列的元素来更新所述HTML表格中的行和列的对应元素。

在上述实施例的基础上，进一步的，如图2所示，该方法的步骤：S140、更新所述HTML表格中的行和列的元素，之后，进一步包括：

S150、根据所述更新后的HTML表格重构所述二维数组(即：更新二维矩阵)。

本发明提供的基于二维矩阵的HTML表格处理方法及实现该方法的计算机，将表格构造成一个二维矩阵的二维数组，利用javascript(一种网页设计程序工具)操作HTML表格(增加或删除行、增加或删除列、单元格合并、单元格拆分等)，从而实现一个基于Web的所见即所得的表格设计器，无需第三方的工具来创建和布局页面、可以根据需要调整的页面布局、与应用规范一致，可以根据具体的应用来约束、规范页面的创建过程。

下面提供上述实施例提供的方法的应用实例。

1、首先创建并解析页面中的HTML表格，构造所述HTML表格对应的二维矩阵，具体包括：

1.1、循环表格中的所有行(循环控制变量::i)；

1.2、针对每一行，循环行内所有单元格循环控制变量::j)；

1.3、取出对应单元格：var cell＝rows[i].cells[j]；

1.4、设置单元格属性：cell.iRow＝rows[i].rowIndex；cell.iCol＝cell.cellIndex；

1.5、针对每一个单元格，按照行跨度进行循环(循环控制变量::ii)；；

1.6、再按照列跨度进行循环(循环控制变量::jj)；

1.7、给数组元素赋值：array[i+ii，j+jj]＝cell；

2、根据前面构建的二维矩阵，实现表格相关操作：

2.1、增加行：

如下表1中：在第4行之前插入行

表1

2.1.1、从二维矩阵中取出第4行：[c40，c31，c31，c43，c44，c45，c46，c47]到selected Row(选中的行)中；

2.1.2、在对应上表1的HTML表格第4行的位置插入一个空行；

2.1.3、以selectedRow作为模板，循环遍历该表1其中的单元格，为新行创建单元格：

a、如果单元格的rowSpan(行跨度)为1，则创建一个新的单元格，其colSpan(列跨度)为模板单元格的colSpan(列跨度)；

b、如果rowSpan＞1则将模板单元格的rowSpan+1；

2.1.4、将新的行的所有单元格加入该二维数组(矩阵)的表1中；

2.2、增加列：

2.2.1、循环遍历二维矩阵中的每一行，并取出对应列的单元格作为模板；

2.2.2、如果单元格的colSpan＝1，则为该行创建一个新的单元格，其rowSpan为模板单元格的rowSpan；

2.2.3、如果col Span＞1，则将模板单元格的colSpan+1；

2.2.4、在二维数组中加入新的元素；

2.3、合并单元格：

2.3.1、只有选择合并的单元格能够融合为一个矩形，才能进行合并；

2.3.2、将选中的单元格按照行和列的顺序，暂存到一个二维数组中；

2.3.3、循环遍历这个二维数组；

2.3.4、将第一个元素的rowSpan设为数组的行数、colSpan设为行中的元素个数；

2.3.5、删除除第一个单元外的其他单元格；

2.3.6、更新二维矩阵；

2.4、拆分单元格：

2.4.1、取得选中的单元格(cell)和表格行(row)；

2.4.2、根据rowSpan、colSpan从二维数组中取得指定范围的元素，并暂存到一个新的二维数组中；

2.4.3、遍历得到的新的二维数组；

2.4.4、将第一个元素的rowSpan和colSpan重置为1，在其他剩余位置创建新的单元格；

2.4.5、更新二维矩阵。

本发明实施例还提供一种计算机，如图3所示，包括：

解析单元310，用于解析HTML表格相应的行和列；

存入单元320，用于构造一个二维数组，并将由所述行和列确定的单元格存入所述二维数组对应的位置；

操作单元330，用于选取所述单元格并进行相应的操作。具体的，在本实施例中，所述操作单元330，用于选取所述单元格并进行增删行列、合并拆分单元格。

基于上述实施例提供的计算机，在其他的实施例中，如图4所示，该计算机还包括：更新单元340，用于根据选取的所述单元格所在的行和列找到所述二维数组中的行和列，并以所述进行相应的操作后的单元格作为模板，更新所述HTML表格中的行和列的元素。

基于上述实施例提供的计算机，在其他的实施例中，如图4所示，该计算机还包括重构单元350，用于根据所述更新后的HTML表格重构所述二维数组。

以上仅为本发明的较佳实施例而已，并不用以限制本发明，凡在本发明的精神和原则之内所作的任何修改、等同替换和改进等，均应包含在本发明的保护范围之内。

Claims

1.一种基于二维矩阵的HTML表格处理方法，其特征在于，包括：

解析HTML表格相应的行和列；

选取所述单元格并进行相应的操作。

2.如权利要求1所述方法，其特征在于，所述选取所述单元格并进行相应的操作，具体包括：

选取所述单元格并进行增删行列、合并拆分单元格。

3.如权利要求1或2所述方法，其特征在于，所述选取所述单元格并进行相应的操作，之后还进一步包括：

4.如权利要求4所述方法，其特征在于，所述更新所述HTML表格中的行和列的元素，之后，进一步包括：

根据所述更新后的HTML表格重构所述二维数组。

5.一种计算机，其特征在于，包括：

解析单元，用于解析HTML表格相应的行和列；

操作单元，用于选取所述单元格并进行相应的操作。

6.如权利要求5所述计算机，其特征在于，所述操作单元，用于选取所述单元格并进行增删行列、合并拆分单元格。

7.如权利要求5或6所述计算机，其特征在于，还包括：更新单元，用于根据选取的所述单元格所在的行和列找到所述二维数组中的行和列，并以所述进行相应的操作后的单元格作为模板，更新所述HTML表格中的行和列的元素。

8.如权利要求7所述计算机，其特征在于，还包括重构单元，用于根据所述更新后的HTML表格重构所述二维数组。