CN105426172B - 基于xml解析技术和模板语言的动态web页面生成方法 - Google Patents

Abstract

本发明提出了一种基于XML解析技术和模板语言的动态WEB页面生成方法，包括：采用模板语言对原始页面进行变量替换，生成包括实时数据的原始页面；采用XML技术对原始页面进行解析；根据多个XML标签的层次关系，依次对每个XML标签执行如下动作：查找XML标签是否在XML标签库中定义，如果是则调用XML标签库中的标签处理程序，将XML标签库中的HTML代码自动生成在与原始页面对应的WEB页面中；在完成所有XML标签的标签处理程序后，标签处理程序输出的HTML代码共同构成WEB页面。本发明采用XML解析技术加模板语言技术，生成动态的页面HTML代码，由此构成完整的WEB页。

Description

基于XML解析技术和模板语言的动态WEB页面生成方法

技术领域

本发明涉及计算机技术领域，特别涉及一种基于XML解析技术和模板语言的动态WEB页面生成方法。

背景技术

在网页开发过程中，开发人员会利用服务器端技术动态的生成网页，如：JSP、Servlet、PHP、ASP、ASP.NET等，这些技术属于底层的技术，只具备最基本的功能，因此技术人员又在这些基础上封装了更强大的框架。例如，在Java领域，这样的框架包括Struts、Spring MVC、Webwork、Apache Tapestry等，这些框架中都包含了更加强大的开发动态WEB页面的功能。并且，它们通常利用JSP标签库的技术来达到目的，例如：Struts就为开发人员提供了一组包含不同主题的JSP标签库，或者是基于一些模板语言技术(如：Velocity、Freemarker等)生成动态页面。

以JSP技术为例，编写JSP页面时，通常要在页面的头部添加许多的头部声明、包括meta、link、script等，以便引入各式各样的页面脚本。虽然可以通过include指令的方式将这些重复性的内容包含在一个子JSP页面当中，但是这个include指令所包含的子JSP页面仍然侵入到了每个JSP页面当中。

在编写页面时，通常都会有许多繁琐重复性的HTML代码，虽然可以通过JSP标签技术将这些繁琐重复的HTML代码封装到JSP标签当中，但是编写JSP标签的API也比较难开发，所以现实的开发当中都是使用已经写好的标签很少增加标签，如果有这样的需求，大多使用include的方式来包含子JSP页面。

网站上线时，为了优化性能会将一些JS和CSS文件分别进行合并、压缩，以减少网页中下载脚本的请求次数以及网络传输的脚本体积，由于合并压缩后的脚本难以阅读和维护，所以通常会保留两份脚本；一份未合并压缩的、一份合并且压缩的。上线的网站中，将页面中的脚本地址指向合并且压缩的。但是这些事情比较繁琐，因此大多数情况是开发时候用的是未合并压缩的脚本，上线时，也不会进行合并和压缩。

发明内容

本发明的目的旨在至少解决所述技术缺陷之一。

为此，本发明的目的在于提出一种基于XML解析技术和模板语言的动态WEB页面生成方法，采用XML解析技术加模板语言技术，生成动态的页面HTML代码，由此构成完整的WEB页。

为了实现上述目的，本发明的实施例提供一种基于XML解析技术和模板语言的动态WEB页面生成方法，包括如下步骤：

步骤S0，采用模板语言对原始页面进行变量替换，以生成包括实时数据的原始页面；

步骤S1，采用XML技术对所述包括实时数据的原始页面进行解析，其中，所述原始页面由多个XML标签构成；

步骤S2，根据所述多个XML标签的层次关系，依次对每个所述XML标签执行如下动作：查找所述XML标签是否在XML标签库中定义，如果是则调用所述XML标签库中的标签处理程序，将所述XML标签库中的HTML代码自动生成在与所述原始页面对应的WEB页面中，其中，所述XML标签库定义以下内容：所述XML标签库的名称和所述XML标签的对应的标签处理程序，在所述标签处理程序中记录有对应的HTML代码，所述HTML代码采用模板语言生成，在所述标签处理程序中，由所述模板语言控制所述标签处理程序输出对应的HTML代码；

步骤S3，在完成所有XML标签的标签处理程序后，所述标签处理程序输出的HTML代码共同构成所述WEB页面。

进一步，所述XML标签库还包括：需要引入的JS脚本文件路径和CSS脚本文件路径。

进一步，在所述步骤S2中，所述调用所述XML标签库中的标签处理程序，包括：通过XML命名空间查找到所需JS脚本文件路径和CSS脚本文件路径，对应的HTML代码则自动加入到所述WEB页面中。

进一步，还包括如下步骤：在添加所述JS脚本文件和CSS脚本文件时，自动判断相同路径下的JS和CSS文件，将同目录的JS和CSS文件进行合并和压缩。

进一步，在所述步骤S2中，如果所述XML标签没有在XML标签库中定义，则将所述XML标签以原内容输出至浏览器工具。

进一步，在所述步骤S2和S3中，将所述XML标签库中的HTML代码自动生成在与所述原始页面对应的WEB页面，包括如下步骤：

首先，将所述HTML代码添加至所述WEB页面的主体body部分；

然后，将所述JS和CSS的脚本代码进行混合、排序、合并及压缩操作后，添加至所述WEB页面的头head部分；

最后，将所述主体body部分和头head部分进行合并，以生成完整的WEB页面。

进一步，在所述步骤S0和步骤S2中，所述模板语言包括Velocity模板语言和Freemarker模板语言。

本发明实施例的基于XML解析技术和模板语言的动态WEB页面生成方法，具有以下有益效果:

(1)显著减小页面文件的体积。

页面中减少了meta、link、script等标签的编写，并且使用XML标签封装了大量的重复性HTML代码，所以编写的页面文件非常简洁。

(2)页面所需的JS、CSS脚本运行时智能引入。

页面通过XML命名空间查找到所需的JS和CSS脚本位置，自动加入到生成的WEB页面中。

(3页面引入的JS、CSS脚本智能合并和压缩。

自动判断相同路径下的JS和CSS文件，将同目录的JS和CSS文件进行合并，并且压缩，无需繁琐的过程。

(4)XML标签处理程序要比JSP标签处理程序更易使用。

本发明附加的方面和优点将在下面的描述中部分给出，部分将从下面的描述中变得明显，或通过本发明的实践了解到。

附图说明

本发明的上述和/或附加的方面和优点从结合下面附图对实施例的描述中将变得明显和容易理解，其中：

图1为根据本发明实施例的基于XML解析技术和模板语言的动态WEB页面生成方法的流程图；

图2为根据本发明实施例的XML标签库的配置片段的示意图；

图3为根据本发明实施例的HTML代码头部分段的示意图；

图4为根据本发明实施例的查询列表页面的WEB页面的示意图。

具体实施方式

下面详细描述本发明的实施例，所述实施例的示例在附图中示出，其中自始至终相同或类似的标号表示相同或类似的元件或具有相同或类似功能的元件。下面通过参考附图描述的实施例是示例性的，旨在用于解释本发明，而不能理解为对本发明的限制。

本发明提出一种基于XML解析技术和模板语言的动态WEB页面生成方法，混合了标准的XML语言以及模板指令的文本文件，其中，模板指令用来为动态WEB页面提供数据和简单的逻辑，XML标签用来产生动态的页面HTML代码，由此构成完整的WEB页面。

如图1所示，本发明实施例的基于XML解析技术和模板语言的动态WEB页面生成方法，包括如下步骤：

步骤S0，采用模板语言对原始页面进行变量替换，以生成包括实时数据的原始页面。其中，此时原始页面文件中的模板指令被转换为实时数据。

步骤S1，采用XML技术对步骤S0中得到的包括实时数据的原始页面进行解析，其中，原始页面由多个XML标签构成。

步骤S2，根据多个XML标签的层次关系，依次对每个XML标签执行如下动作：查找XML标签是否在XML标签库中定义，如果是则调用XML标签库中的标签处理程序，将XML标签库中的HTML代码自动生成在与原始页面对应的WEB页面中。如果XML标签没有在XML标签库中定义，则将XML标签以原内容输出至浏览器工具。

XML标签库定义以下内容：XML标签库的名称name和XML标签的对应的标签处理程序class。

在标签处理程序中记录有对应的HTML代码，能够输出对应页面的HTML代码。这些标签处理程序将XML标签翻译成树状结构组织的标签处理程序集合，即按照XML中对应的层次关系组成一个树状的数据结构，从树的根部开始，依次向里执行每一个标签处理程序。

在本发明的一个实施例中，XML标签库还包括：需要引入的JS脚本文件路径和CSS脚本文件路径。将页面所需JS和CSS定义在页面外部(标签库文件)，通过XML命名空间动态的在WEB页面中生成。

在本发明的一个实施例中，JS脚本文件和CSS脚本文件的路径可以定义在全局范围内，也可以定义在某个XML标签的内部。由此，只有页面文件中使用过这个XML标签，对应的引用文件脚本才会在WEB页面中产生。

具体地，在添加JS脚本文件和CSS脚本文件时，自动判断相同路径下的JS和CSS文件，将同目录的JS和CSS文件进行合并和压缩。通过XML命名空间查找到所需JS脚本文件路径和CSS脚本文件路径，对应的HTML代码则自动加入到WEB页面中。

脚本文件合并和压缩是网站性能优化的手段之一，通常在网站上线之前会通过一些工具处理这些需要合并和压缩的脚本，并且修改页面中引用脚本的代码，将路径指向合并压缩后的脚本。但是，合并压缩的脚本是不利于阅读、修改和调试的，因此如果要修改调试脚本，必须恢复成合并压缩前的样子。修改调试完之后再进行合并和压缩。

本发明基于XML解析技术和模板语言的动态WEB页面生成方法，将上述过程变成自动的。脚本压缩合并后，脚本的文件名就变成了一个16进制字符串的名称，脚本的合并遵循同类型且同路径下的脚本文件才能合并，并且内容也是被压缩的，这个过程没有修改任何的页面文件。

下面对上述JS脚本文件和CSS脚本文件的处理，以及HTML代码生成到WEB页面的过程进行详细说明。

由于在页面中引用JS和CSS的脚本内容是在运行时动态添加的，因此在动态添加引用脚本的时候对这些脚本进行合并和压缩，合并压缩后将产生一个新的引用路径，在生成的WEB页面中，将使用新的路径代替原有的路径。

如上所述，XML标签库被赋予了一个唯一的名字和一个定义用的文件，定义了每种XML标签的标签处理程序和需要引入的JS、CSS脚本文件的路径。标签处理程序能够接收页面文件中为该标签设置的属性，并能向页面中输出HTML代码。页面文件会利用XML命名空间来对应不同的XML标签库，因为XML文件中可以定义多个命名空间，所以同一个页面也可以同时使用多个标签库。即，通过XML命名空间查找到所需JS脚本文件路径和CSS脚本文件路径，对应的HTML代码则自动加入到WEB页面中。

由于在XML标签库中已经定义了需要引入的JS和CSS文件路径，因此在页面中无需编写引入脚本文件的HTML脚本，只需通过命名空间指定XML标签库的名称，相关的HTML代码就会自动的在生成的WEB页面中产生。

在本发明的一个实施例中，HTML代码采用模板语言生成，实现向页面中填充动态数据。其中，步骤S0和步骤S2中使用的模板语言包括Velocity模板语言和Freemarker模板语言等或者自行开发的任何类型的模板语言。

需要说明的是，在本发明的XML解析技术与模板语言的组合方式，先解析模板语言，再进行XML解析。

模板语言或者也称为模板引擎，可以应用于各种WEB开发场景。模板引擎最大的一个作用，就是让数据与界面分离，不局限于Java技术，PHP、ASP、JavaScript等技术。在本发明中，模板引擎的作用也是让数据与界面分离，并且，它不但用在页面文件的解析上，标签实现类的模板文件里也使用了Velocity填充数据。

步骤S3，在完成所有XML标签的标签处理程序后，标签处理程序输出的HTML代码共同构成WEB页面。

标签处理程序产生的HTML代码会首先输出到缓冲区，一个WEB页面通常分为头head部分和主体body部分，head部分包含引入JS和CSS的脚本代码，body部分主要用于展现的HTML代码。

首先，将HTML代码添加至WEB页面的主体body部分；

然后，将JS和CSS的脚本代码进行混合、排序、合并及压缩操作后，添加至WEB页面的头head部分；

最后，将主体body部分和头head部分进行合并，以生成完整的WEB页面。

综上，本发明首先先处理body部分，之后再返回处理head部分。当处理完body部分之后，WEB页面智能引入的JS和CSS脚本文件已经全部分析出来。将这部分JS和CSS脚本文件已与head部分的其他内容进行混合、排序、合并、压缩等操作，最后和缓冲区中的body内容进行合并，最终产生一个完整的WEB页面。

下面参考图2和图3对XML标签库的配置片段HTML代码进行说明。

每一个XML标签库文件都在全局范围内赋予了一个名称，在页面文件中，通过XML命名空间的方式与该XML标签库文件挂钩。如图2所示，XML标签库的名称是“/jui”，页面文件中，通过“xmlns＝”/jui””的方式引用了该XML标签库。这时，该页面文件在浏览器中显示效果对应的源代码，如图3所示。

在图2中，并没有指定任何的“meta”、“link”、“script”标签，而仅仅通过“xmlns＝”/jui””的方式指定了标签库，标签库中定义的“meta”、“style”、“script”信息就被自动添加到了生成的目标页面中。图2上半部的XML标签库片段与图3中的HTML代码头部片段中的标号①、②、③是完全对应的。

图4为根据本发明实施例的查询列表页面的WEB页面的示意图。下方代码为查询列表页面在浏览器的源代码，记为代码1。

从上方代码可以看出页面文件的内容非常简洁，这其中有几个主要的标签：“QueryPane”标签将产生这个查询列表的主框架，“SearchItem”布局每个查询条件的输入区域，“GridToolbar”和“GridColumn”负责产生表格的按钮和数据列的展示。输出到浏览器的HTML代码如下所示，记为代码2

实际输出到浏览器的代码，要比编写的页面文件代码多。以QueryPane标签为例，QueryPane标签的实现类包含一个Java文件和一个模板文件，主要产生页面代码的是下方代码所示的模板文件，记为代码3。

模板文件只是标签实现类的一种辅助方式，可以使用纯代码的方式完成标签的输出逻辑，以上仅为说明标签实现类的作用。将代码2与代码2进行比较，可以很容易的看出标签实现类的作用.标签实现类负责处理输出到浏览器的真正的HTML代码，像前文中页面文件里仅写了“QueryPane”这样一个XML标签，但是输出到浏览器的确实更加复杂繁琐的HTML代码。这些HTML代码都隐藏在标签的实现类(或者标签模板文件)里，如代码2和代码3中方框内的部分就是标签模板文件到浏览器输出的对应内容，内容基本相似。

根据本发明实施例的基于XML解析技术和模板语言的动态WEB页面生成方法，采用XML解析技术加模板语言技术，生成动态的页面HTML代码，由此构成完整的WEB页。

本发明实施例的基于XML解析技术和模板语言的动态WEB页面生成方法，具有以下有益效果:

(1)显著减小页面文件的体积。

页面中减少了meta、link、script等标签的编写，并且使用XML标签封装了大量的重复性HTML代码，所以编写的页面文件非常简洁。

(2)页面所需的JS、CSS脚本运行时智能引入。

页面通过XML命名空间查找到所需的JS和CSS脚本位置，自动加入到生成的WEB页面中。

(3页面引入的JS、CSS脚本智能合并和压缩。

自动判断相同路径下的JS和CSS文件，将同目录的JS和CSS文件进行合并，并且压缩，无需繁琐的过程。

(4)XML标签处理程序要比JSP标签处理程序更易使用。

XML标签处理程序最简单的用法只需一个简单的Java类和一个标签模板文件，模板文件中添加什么HTML代码，就会在WEB页面中生成对应的内容，并且支持模板指令。

在本说明书的描述中，参考术语“一个实施例”、“一些实施例”、“示例”、“具体示例”、或“一些示例”等的描述意指结合该实施例或示例描述的具体特征、结构、材料或者特点包含于本发明的至少一个实施例或示例中。在本说明书中，对上述术语的示意性表述不一定指的是相同的实施例或示例。而且，描述的具体特征、结构、材料或者特点可以在任何的一个或多个实施例或示例中以合适的方式结合。

尽管上面已经示出和描述了本发明的实施例，可以理解的是，上述实施例是示例性的，不能理解为对本发明的限制，本领域的普通技术人员在不脱离本发明的原理和宗旨的情况下在本发明的范围内可以对上述实施例进行变化、修改、替换和变型。本发明的范围由所附权利要求极其等同限定。

Claims (5)

1.一种基于XML解析技术和模板语言的动态WEB页面生成方法，其特征在于，包括如下步骤：

步骤S0，采用模板语言对原始页面进行变量替换，以生成包括实时数据的原始页面；

步骤S1，采用XML技术对所述包括实时数据的原始页面进行解析，其中，所述原始页面由多个XML标签构成，其中，所述XML标签库还包括：需要引入的JS脚本文件路径和CSS脚本文件路径；

步骤S2，根据所述多个XML标签的层次关系，依次对每个所述XML标签执行如下动作：查找所述XML标签是否在XML标签库中定义，如果是则调用所述XML标签库中的标签处理程序，将所述XML标签库中的HTML代码自动生成在与所述原始页面对应的WEB页面中，其中，所述XML标签库定义以下内容：所述XML标签库的名称和所述XML标签的对应的标签处理程序，在所述标签处理程序中记录有对应的HTML代码，所述HTML代码采用模板语言生成，在所述标签处理程序中，由所述模板语言控制所述标签处理程序输出对应的HTML代码，其中，调用所述XML标签库中的标签处理程序，包括：通过XML命名空间查找到所需JS脚本文件路径和CSS脚本文件路径，对应的HTML代码则自动加入到所述WEB页面中；

步骤S3，在完成所有XML标签的标签处理程序后，所述标签处理程序输出的HTML代码共同构成所述WEB页面。

2.如权利要求1所述的基于XML解析技术和模板语言的动态WEB页面生成方法，其特征在于，还包括如下步骤：在添加所述JS脚本文件和CSS脚本文件时，自动判断相同路径下的JS和CSS文件，将同目录的JS和CSS文件进行合并和压缩。

3.如权利要求1所述的基于XML解析技术和模板语言的动态WEB页面生成方法，其特征在于，在所述步骤S2中，如果所述XML标签没有在XML标签库中定义，则将所述XML标签以原内容输出至浏览器工具。

4.如权利要求1所述的基于XML解析技术和模板语言的动态WEB页面生成方法，其特征在于，在所述步骤S2和S3中，将所述XML标签库中的HTML代码自动生成在与所述原始页面对应的WEB页面，包括如下步骤：

首先，将所述HTML代码添加至所述WEB页面的主体body部分；

然后，将所述JS和CSS的脚本代码进行混合、排序、合并及压缩操作后，添加至所述WEB页面的头head部分；

最后，将所述主体body部分和头head部分进行合并，以生成完整的WEB页面。

5.如权利要求1所述的基于XML解析技术和模板语言的动态WEB页面生成方法，其特征在于，在所述步骤S0和步骤S2中，所述模板语言包括Velocity模板语言和Freemarker模板语言。