专利名称：一种实现树形结构的方法及装置的制作方法
技术领域：
本发明涉及Web应用领域，特别是涉及一种实现树形结构的方法及装置。
背景技术：
随着信息化技术的发展，各种信息化的web应用系统越来越多。用树形结构展现 数据在web应用中有着很广泛的应用，如用于显示带有上下级关系的组织结构和用户关 系、用于显示层级的菜单等等。树形结构能最直观地呈现出数据间的父子关系。树形结构最基本的单元是节点，一个常见的树形结构包括根节点、分支节点和叶 子节点。在客户端应用程序中一般通过使用的开发语言提供的树形控件来实现，而在web 应用程序中因为没有相应的控件，需要采用其它如JavaScript、CSS等页面技术来实现。目前最常见的技术方案是采用JavaScript来实现的。在浏览器端页面中加入树 形结构的HTML、JavaScript代码，在服务器端编写组织树形结构数据的业务代码，浏览器 端通过解析服务端返回的数据，最终展现出树形结构。针对不同的业务场景，程序员需要编 写大量不同的树形结构HTML代码、JavaScript代码和服务器端的业务代码来实现所需的 显示效果。但是，树形结构的JavaScript代码及服务器端的业务代码通常很复杂，每实现一 个树形结构都需要重新编写代码，使得实现树形结构的效率非常低；而且展现树形结构的 代码与服务端的业务代码对应，代码复用性差。
发明内容
有鉴于此，本发明的目的在于提供一种实现树形结构的方法及装置，能够通过提 高实现树形结构的效率，提高代码的复用性。为实现上述目的，本发明提供了如下方案一种实现树形结构的方法，包括确定用户在页面文件中为树形结构指定的元数据，所述元数据为所述树形结构特 有的业务逻辑代码；当需要展现页面中的树形结构时，解析所述页面文件中的元数据；将解析获得的元数据信息与树形结构模板代码相结合，获得展现树形结构所需的 数据，并返回给浏览器，以便浏览器在页面中展现相应的树形结构；所述树形结构模板代码 为预先抽象出的所有树形结构的公用代码。优选的，所述确定用户在页面文件中为树形结构指定的元数据包括通过接收用户在页面文件中为树形结构指定的元数据ID，确定所述元数据；所述解析所述页面文件中的元数据包括通过所述元数据ID加载相应的元数据，并进行解析。优选的，所述确定用户在页面文件中为树形结构指定的元数据包括接收用户在页面上为树形结构选择的特有业务逻辑；
根据所述特有业务逻辑生成相应的元数据，并将所述生成的元数据作为用户指定 的元数据。优选的，所述元数据中的配置信息包括树的后台数据模型、后台数据模型的过滤条件、树的分层读取信息、树的层次属 性、点击节点属性、右键点击节点属性及事件扩展属性。优选的，所述后台数据模型的属性包括节点ID、父节点ID及节点类型。优选的，所述后台数据模型的属性还包括树的级别、节点是否为叶子节点及排序。一种实现树形结构的装置，包括接口单元，用于确定用户在页面文件中为树形结构指定的元数据，所述元数据为 所述树形结构中特有的业务逻辑代码；解析单元，用于当需要展现页面中的树形结构时，解析所述页面文件中的元数 据；组装单元，用于将解析获得的元数据信息与树形结构模板代码相结合，获得展现 树形结构所需的数据，并返回给浏览器，以便浏览器在页面中展现相应的树形结构；所述树 形结构模板代码为预先抽象出的所有树形结构的公用代码。优选的，所述接口单元包括第一接收子单元，用于接收用户在页面文件中为树形结构指定的元数据ID 确定子单元，用于根据所述元数据ID确定所述元数据；所述解析单元包括加载子单元，用于通过所述元数据ID加载相应的元数据；解析子单元，用于解析所述查找到的元数据。优选的，所述接口单元包括第二接收子单元，用于接收用户在页面上为树形结构选择的特有业务逻辑；元数据生成子单元，用于根据所述特有业务逻辑生成相应的元数据，并将所述生 成的元数据作为用户指定的元数据。优选的，所述元数据中的配置信息包括树的后台数据模型、后台数据模型的过滤条件、树的分层读取信息、树的层次属 性、点击节点属性、右键点击节点属性及事件扩展属性。优选的，所述后台数据模型的属性包括节点ID、父节点ID及节点类型。优选的，所述后台数据模型的属性还包括树的级别、节点是否为叶子节点及排序。根据本发明提供的具体实施例，本发明公开了以下技术效果本发明通过引入元数据及树形结构模板代码，将树形结构所需的数据信息配置在 元数据中，浏览器端代码只是树形结构模板代码和在页面文件中定义的元数据，当浏览器 端展现树形结构时，服务器端先加载相应的元数据，再通过解析元数据里面的信息，将解析 获得的元数据信息与树形结构模板代码相结合，获得展现树形结构所需的数据，并返回给 浏览器，以便浏览器在页面中展现相应的树形结构。因此，树形结构模板代码对于用户而言 是透明的，用户无须重新编写这部分代码，也不用关系这部分代码的具体实现，因此提高了 代码的复用性；同时，只需要在页面文件中配置元数据，因此，提高了实现树形结构的效率。
图1是本发明实施例提供的方法的流程图；图2是本发明实施例提供的装置的示意图。
具体实施例方式为使本发明的上述目的、特征和优点能够更加明显易懂，下面结合附图和具体实 施方式对本发明作进一步详细的说明。参见图1，本发明实施例提供的实现树形结构的方法包括以下步骤S101 确定用户在页面文件中为树形结构指定的元数据，所述元数据为所述树形 结构中特有的业务逻辑代码；为了达到提高实现树形结构的效率、提高代码的复用性的目的，本发明实施例首 先抽象出树形结构的JavaScript代码作为基础代码，每个树形结构均使用该基础代码作 为树形结构模板代码。这些树形结构模板代码是各树形结构公用的部分，只要实现树形结 构，就必须包含有这些代码。也就是说，本发明实施例首先将各树形结构中公用的代码抽取 出来，形成树形结构模板代码。用户在实现树形结构时，不需要在重新编写这部分代码，也 不需要关心这部分代码是如何实现的。同时，还需要在后台定义树形结构的后台数据模型，一个树形结构对应的数据模 型至少需要包括三个属性节点ID、父节点ID、节点类型，通过这些属性可以实现树形结构 的展现。当然，为了加快展现树形结构的速度，该数据模型中还可以包括其他可选属性，如 树的级别、是否为叶子节点及排序等。通过可选属性可以优化后台查询树形结构数据的算 法，减少遍历数据的次数，提高系统的性能。当然，每个树形结构也都具有各自特有的业务逻辑代码，这部分特有的业务逻辑 代码用来获取树形结构所需的数据信息，包括是否一次性展开、通过哪个对象取数据、节点 类型是文本还是链接、是否包含点击事件等等，当然还包括所述后台数据模型的配置信息寸。本发明实施例在提取出树形结构模板代码的同时，还需要将树形结构特有的业务 逻辑代码配置在元数据中。树形结构所需的元数据将会形成XML配置文件，通过该配置文 件可以定位到具体的元数据。通过元数据可以将要展示的树形结构模板代码与后台数据模 型关联起来。这样，用户在编写树形结构代码时，就只需要在编写的页面文件中指定所需的元 数据。其中，用户可以手动地编写元数据中需要的代码并指定代码的ID ；例如，用户需要将 节点类型设置为文本型，则可以手动地编写实现这一设置的代码，并保存为XML文件，同时 可以就文件名等标识指定为该元数据的ID，以便于服务端进行解析时能够准确地定位到该 元数据。当然，也可以为用户提供生成元数据代码的入口，自动生成用户所需的元数据。例 如，用户同样需要将节点类型设置为文本型，则可以在页面上为用户提供“节点类型设置” 的入口，还可以通过下拉框等方式提示用户选择节点的类型，这样，用户点击选择文本型之 后，就可以点击“生成元数据”的按钮，然后可以自动生成相应的元数据。仍然可以将该元 数据保存为XML文件，并将需要的元数据ID写入页面文件中即可。
S102 当需要展现页面中的树形结构时，解析所述页面文件中的元数据；解析所述页面文件中的元数据时，将元数据文件读入到内存，并通过解析xml文 件的方式将元数据中定义的信息转换为服务器端的程序对象。步骤S101中的浏览器端的代码只是树形结构模板代码以及在页面文件中指定的 元数据。其中，通过元数据ID来进行元数据的定位时，用户只需要在页面文件中指定元数 据ID。当需要展现页面中的树形结构时，服务端会解析页面文件中的元数据，如果页面 文件中保存的是元数据的ID，则可以首先通过元数据的ID加载元数据，然后进行解析。解析元数据的目的是从数据库中获取到树形结构所需的数据信息，只有获取到具 体的数据信息，浏览器端才能展现出树形结构。S103:将解析获得的元数据信息与树形结构模板代码相结合，服务器端首先加载 树形结构模板代码，然后根据解析后的元数据中描述的内容在模板代码中加入业务个性化 的代码，最终获得展现树形结构所需的完整代码，并返回给浏览器，以便浏览器在页面中展 现相应的树形结构；所述树形结构模板代码为预先抽象出的所有树形结构的公用代码。解析元数据之后，就可以将解析获得的元数据信息与树形结构模板代码相结合， 获得展现树形结构所需的数据。此时获得的展现树形结构所需的数据，相当于是传统方式 下用户手动编写的树形结构的全部代码所获得的数据，然后将这些数据返回到浏览器端， 这样，浏览器端就可以根据返回的展现树形结构所需的数据展现出相应的树形结构。也就是说，现有技术中，用户需要编写在服务端编写业务代码，使得服务端可以根 据这些业务代码获取树形结构中的数据信息，这些业务代码全部是由用户编写的；但是在 本发明实施例中，用户不需要编写树形结构模板代码，只需要指定需要的元数据；在需要展 现树形结构时，服务端可以自动解析用户指定的元数据，获取到展现树形结构所需的数据 信息，然后浏览器端就可以展现相应的树形结构了。可见，在本发明实施例中，树形结构模板代码是可以复用的，用户可以不用每次实 现树形结构时都编写该部分代码，因此，提高了代码的复用性，而且当需要进行全局性的样 式修改时，也容易维护；同时，用户可以采用配置式的方式来实现属性结构的特有业务逻辑 代码，将传统方式下需要用户编写的服务端获取树形结构数据的业务代码，转换到元数据 中，实现方式统一，这样，当运行期需要修改某个树形结构时，可以直接通过修改配置文件 来实现，因此，提高了实现树形结构的效率。其中，元数据中配置的信息可以包括树的后台数据模型配置元数据展示的后台数据模型；后台数据模型的过滤条件配置数据过滤信息；树的分层读取一次性读取所有数据还是异步读取数据；第一次展现时展现的层 数；异步读取时，每次读取的层数；节点的层次属性用于实现树形结构中不同层次具有不同的展现效果，包括节点 展现和收起时使用的图片；节点的类型是单选框、多选框、文本还是链接；点击节点属性当点击树中节点时执行的函数名称；右键节点属性配置当右键节点时显示的菜单内容和点击相应菜单时执行的函数 名称；
事件扩展属性配置树形结构初始化时执行的函数；配置树中节点进行删除操作 时执行的函数等，该功能方便用户监控数据变化提供方便。需要说明的是，本发明同样适用于其它页面展现内容的实现，如列表、tab、级联下 拉框等，将这些页面展示场景进行提炼，抽象出可复用的JavaScript代码，然后通过元数 据将业务逻辑与相应的JavaScript代码进行关联，展现出不同样式不同功能的内容。与本发明实施例提供的实现树形结构的方法相对应，本发明实施例还提供了一种 实现树形结构的装置，参见图2，该装置包括接口单元U201，用于确定用户在页面文件中为树形结构指定的元数据，所述元数 据为所述树形结构中特有的业务逻辑代码；解析单元U202，用于当需要展现页面中的树形结构时，解析所述页面文件中的元 数据；组装单元U203，用于将解析获得的元数据信息与树形结构模板代码相结合，获得 展现树形结构所需的数据，并返回给浏览器，以便浏览器在页面中展现相应的树形结构；所 述树形结构模板代码为预先抽象出的所有树形结构的公用代码。通过本发明实施例提供的装置，树形结构模板代码是可以复用的，用户可以不用 每次实现树形结构时都编写该部分代码，因此，提高了代码的复用性，而且当需要进行全局 性的样式修改时，也容易维护；同时，用户可以采用配置式的方式来实现属性结构的特有业 务逻辑代码，将传统方式下需要用户编写的服务端获取树形结构数据的业务代码，转换到 元数据中，实现方式统一，这样，当运行期需要修改某个树形结构时，可以直接通过修改配 置文件来实现，因此，提高了实现树形结构的效率。其中，用户可以在页面文件中指定元数据的ID，则可以通过元数据的ID来确定用 户需要的元数据，此时，接口单元U201可以包括第一接收子单元，用于接收用户在页面文件中为树形结构指定的元数据ID ；确定子单元，用于根据所述元数据ID确定所述元数据；相应的，解析单元U202可以包括加载子单元，用于通过所述元数据ID加载相应的元数据；
解析子单元，用于解析所述查找到的元数据。在指定元数据时，可以手动编写元数据代码，也可以由工具自动生成，自动生成 时，接口单元U201包括第二接收子单元，用于接收用户在页面上为树形结构选择的特有业务逻辑；元数据生成子单元，用于根据所述特有业务逻辑生成相应的元数据，并将所述生 成的元数据作为用户指定的元数据。其中，所述元数据中的配置信息可以包括树的后台数据模型、后台数据模型的过 滤条件、树的分层读取信息、树的层次属性、点击节点属性、右键点击节点属性及事件扩展 属性。其中的后台数据模型至少包含以下属性节点ID、父节点ID及节点类型。在实际 应用中，为了加快树形结构的展现速度，后台数据模型中还可以包括树的级别、节点是否为 叶子节点及排序等。以上对本发明所提供的一种实现树形结构的方法及装置，进行了详细介绍，本文中应用了具体个例对本发明的原理及实施方式进行了阐述，以上实施例的说明只是用于帮 助理解本发明的方法及其核心思想；同时，对于本领域的一般技术人员，依据本发明的思 想，在具体实施方式
及应用范围上均会有改变之处。综上所述，本说明书内容不应理解为对本发明的限制。
权利要求
一种实现树形结构的方法，其特征在于，包括确定用户在页面文件中为树形结构指定的元数据，所述元数据为所述树形结构特有的业务逻辑代码；当需要展现页面中的树形结构时，解析所述页面文件中的元数据；将解析获得的元数据信息与树形结构模板代码相结合，获得展现树形结构所需的数据，并返回给浏览器，以便浏览器在页面中展现相应的树形结构；所述树形结构模板代码为预先抽象出的所有树形结构的公用代码。
2.根据权利要求1所述的方法，其特征在于，所述确定用户在页面文件中为树形结构 指定的元数据包括通过接收用户在页面文件中为树形结构指定的元数据ID，确定所述元数据； 所述解析所述页面文件中的元数据包括 通过所述元数据ID加载相应的元数据，并进行解析。
3.根据权利要求1所述的方法，其特征在于，所述确定用户在页面文件中为树形结构 指定的元数据包括接收用户在页面上为树形结构选择的特有业务逻辑；根据所述特有业务逻辑生成相应的元数据，并将所述生成的元数据作为用户指定的元 数据。
4.根据权利要求1所述的方法，其特征在于，所述元数据中的配置信息包括树的后台数据模型、后台数据模型的过滤条件、树的分层读取信息、树的层次属性、点 击节点属性、右键点击节点属性及事件扩展属性。
5.根据权利要求4所述的方法，其特征在于，所述后台数据模型的属性包括节点ID、父 节点ID及节点类型。
6.根据权利要求5所述的方法，其特征在于，所述后台数据模型的属性还包括树的级 别、节点是否为叶子节点及排序。
7. 一种实现树形结构的装置，其特征在于，包括接口单元，用于确定用户在页面文件中为树形结构指定的元数据，所述元数据为所述 树形结构中特有的业务逻辑代码；解析单元，用于当需要展现页面中的树形结构时，解析所述页面文件中的元数据； 组装单元，用于将解析获得的元数据信息与树形结构模板代码相结合，获得展现树形 结构所需的数据，并返回给浏览器，以便浏览器在页面中展现相应的树形结构；所述树形结 构模板代码为预先抽象出的所有树形结构的公用代码。
8.根据权利要求7所述的装置，其特征在于，所述接口单元包括第一接收子单元，用于接收用户在页面文件中为树形结构指定的元数据ID ； 确定子单元，用于根据所述元数据ID确定所述元数据； 所述解析单元包括加载子单元，用于通过所述元数据ID加载相应的元数据； 解析子单元，用于解析所述查找到的元数据。
9.根据权利要求8所述的装置，其特征在于，所述接口单元包括 第二接收子单元，用于接收用户在页面上为树形结构选择的特有业务逻辑；元数据生成子单元，用于根据所述特有业务逻辑生成相应的元数据，并将所述生成的 元数据作为用户指定的元数据。
10.根据权利要求7所述的装置，其特征在于，所述元数据中的配置信息包括树的后台数据模型、后台数据模型的过滤条件、树的分层读取信息、树的层次属性、点 击节点属性、右键点击节点属性及事件扩展属性。
11.根据权利要求10所述的装置，其特征在于，所述后台数据模型的属性包括节点ID、 父节点ID及节点类型。
12.根据权利要求11所述的装置，其特征在于，所述后台数据模型的属性还包括树的 级别、节点是否为叶子节点及排序。
全文摘要
本发明公开了一种实现树形结构的方法，该方法包括确定用户在页面文件中为树形结构指定的元数据，所述元数据为所述树形结构特有的业务逻辑代码；当需要展现页面中的树形结构时，解析所述页面文件中的元数据；将解析获得的元数据信息与树形结构模板代码相结合，获得展现树形结构所需的数据，并返回给浏览器，以便浏览器在页面中展现相应的树形结构；所述树形结构模板代码为预先抽象出的所有树形结构的公用代码。通过本发明，提高了代码的可复用性，提高了实现树形结构的效率。
文档编号G06F17/30GK101799753SQ20091024278
公开日2010年8月11日 申请日期2009年12月17日 优先权日2009年12月17日
发明者方国, 杨宁, 王宇飞, 王能 申请人:中国电力科学研究院;国家电网公司