CN107193815A - 一种页面代码的处理方法、装置及设备 - Google Patents

Abstract

本申请提供一种页面代码的处理方法、装置及设备，其中，所述方法包括加载目标页面的页面代码；其中所述页面代码包括具备嵌套关系的至少两个页面布局控件，其中所述页面布局控件中包括有页面元素；确定所述页面代码中页面元素的位置信息，形成位置信息集；在终端设备的屏幕上渲染至少一个预设页面布局控件，以及根据所述位置信息集将所述页面元素渲染在所述至少一个预设页面布局控件中。本申请实施方式提供的一种页面代码的处理方法、装置及设备，能够减小对终端设备的CPU和内存的占用率。

Description

一种页面代码的处理方法、装置及设备

技术领域

本申请涉及数据处理技术领域，特别涉及一种页面代码的处理方法、装置及设备。

背景技术

随着数据处理技术的不断发展，越来越多的数据都可以通过可视化处理的方法，以图片或者文字的形式向用户展现。

当前，在终端设备的显示屏上显示的各种各样的页面往往是通过对页面代码进行处理得到的。所述页面代码往往按照一定的规则进行编写，当终端设备中的处理器对编写的页面代码进行运算后，便可以将该页面代码中包含的图片、文字或者视频等信息显示于终端设备的显示屏上，以供用户观看。

目前，提供给终端设备的处理器进行处理的目标页面的页面代码例如可以包括名称为c1的容器以及名称为c2的容器，其中，c2容器可以嵌套于c1容器中，在c2容器中可以填充图片(image)和文字(text)这两个元素。当然，目标页面的代码中还可以包括更多个容器，这些容器往往可以通过嵌套的方式进行设置。这样设置的目的在于，可以通过一个容器对嵌套于该容器内的其它容器的排列方式进行限定，例如上述的c1容器可以限定在c1容器内嵌套的其它容器按照从左往右或者从上到下的顺序进行排列。

现有技术中在对上述例子中目标页面的页面代码进行处理时，首先可以将c1容器渲染至终端设备的显示屏上，在该c1容器内，可以继续渲染c2容器，在c2容器内则可以渲染image和text的内容。其中，尽管c1容器和c2容器被渲染至显示屏上，但在实际应用中这两个容器是不显示的，因此用户仅仅能从终端设备的显示屏上观看到image和text的内容。也就是说，容器可以作为透明的背景，其作用可以理解为用来为容器内显示的可视化信息(图片、文字、视频等)提供布局方式。

上述例举的页面代码仅仅是为了阐述现有技术中对页面代码进行处理的方式，在实际应用中，为了在终端设备的显示屏上显示复杂的页面布局，在页面代码中往往可以嵌套非常多的容器。这些容器在渲染到显示屏上时，尽管不会被用户观看到，但却会占用终端设备较多的CPU资源和内存资源，从而造成在页面显示和页面滑动的过程中产生卡顿的现象，影响了用户的体验。

应该注意，上面对技术背景的介绍只是为了方便对本申请的技术方案进行清楚、完整的说明，并方便本领域技术人员的理解而阐述的。不能仅仅因为这些方案在本申请的背景技术部分进行了阐述而认为上述技术方案为本领域技术人员所公知。

发明内容

本申请实施方式的目的在于提供一种页面代码的处理方法、装置及设备，以减小对终端设备的CPU和内存的占用率。

为实现上述目的，本申请一方面提供一种页面代码的处理方法，所述方法包括：加载目标页面的页面代码；其中所述页面代码包括具备嵌套关系的至少两个页面布局控件，其中所述页面布局控件中包括有页面元素；确定所述页面代码中页面元素的位置信息，形成位置信息集；在终端设备的屏幕上渲染至少一个预设页面布局控件，以及根据所述位置信息集将所述页面元素渲染在所述至少一个预设页面布局控件中。

为实现上述目的，本申请另一方面提供一种页面代码的处理装置，所述装置包括：页面代码加载单元，用于加载目标页面的页面代码；其中所述页面代码包括具备嵌套关系的至少两个页面布局控件，其中所述页面布局控件中包括有页面元素；位置信息集确定单元，用于确定所述页面代码中页面元素的位置信息，形成位置信息集；渲染单元，用于在终端设备的屏幕上渲染至少一个预设页面布局控件，以及根据所述位置信息集将所述页面元素渲染在所述至少一个预设页面布局控件中。

另外，本申请还提供一种页面代码的处理设备，所述设备包括：显示屏幕；存储器，其用于存储目标页面的页面代码；处理器，其从所述存储器中加载所述目标页面的页面代码；其中所述页面代码包括具备嵌套关系的至少两个页面布局控件，其中所述页面布局控件中包括有页面元素；确定所述页面代码中页面元素的位置信息，形成位置信息集；在所述显示屏幕上渲染至少一个预设页面布局控件，以及根据所述位置信息集将所述页面元素渲染在所述至少一个预设页面布局控件中。

由以上本申请实施方式提供的技术方案可见，本申请在终端设备的屏幕上最终只会渲染预设页面布局控件和页面代码中的页面元素，对于页面代码中多余的页面布局控件可以不进行渲染，从而降低了终端设备的CPU和内存的占用率，使得页面在加载或者滑动时可以更加顺畅，不会产生卡顿的现象。

参照后文的说明和附图，详细公开了本申请的特定实施方式，指明了本申请的原理可以被采用的方式。应该理解，本申请的实施方式在范围上并不因而受到限制。在所附权利要求的精神和条款的范围内，本申请的实施方式包括许多改变、修改和等同。

针对一种实施方式描述和/或示出的特征可以以相同或类似的方式在一个或更多个其它实施方式中使用，与其它实施方式中的特征相组合，或替代其它实施方式中的特征。

应该强调，术语“包括/包含”在本文使用时指特征、整件、步骤或组件的存在，但并不排除一个或更多个其它特征、整件、步骤或组件的存在或附加。

附图说明

所包括的附图用来提供对本申请实施方式的进一步的理解，其构成了说明书的一部分，用于例示本申请的实施方式，并与文字描述一起来阐释本申请的原理。显而易见地，下面描述中的附图仅仅是本申请的一些实施方式，对于本领域普通技术人员来讲，在不付出创造性劳动性的前提下，还可以根据这些附图获得其他的附图。在附图中：

图1为本申请实施方式提供的一种页面代码的处理方法流程图；

图2为本申请实施方式提供的一种页面代码的处理方法中通过起始坐标确定位置信息集步骤的流程图；

图3为本申请实施方式提供的一种页面代码的处理方法中通过距离信息确定位置信息集步骤的流程图；

图4为本申请实施方式提供的一种页面代码的处理方法中渲染预设页面布局控件步骤的流程图；

图5为本申请实施方式提供的一种页面代码的处理装置的功能模块图；

图6为本申请实施方式提供的一种页面代码的处理设备的示意图。

具体实施方式

为了使本技术领域的人员更好地理解本申请中的技术方案，下面将结合本申请实施方式中的附图，对本申请实施方式中的技术方案进行清楚、完整地描述，显然，所描述的实施方式仅仅是本申请一部分实施方式，而不是全部的实施方式。基于本申请中的实施方式，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其它实施方式，都应当属于本申请保护的范围。

请参阅图1。图1为本申请实施例方式提供的一种页面代码的处理方法流程图。如图1所示，所述方法可以包括以下步骤。

步骤S11：加载目标页面的页面代码；其中所述页面代码包括具备嵌套关系的至少两个页面布局控件，其中所述页面布局控件中包括有页面元素。

在本实施方式中，可以通过终端设备的CPU对页面代码进行处理，以确定所述页面代码中的页面元素在终端设备的屏幕上的位置。所述终端设备可以为移动智能电话、计算机(包括笔记本电脑，台式电脑)、平板电子设备、个人数字助理(PDA)或者智能可穿戴设备等具备数据处理功能的终端设备。

在本实施方式中，所述页面代码可以包含于在终端设备中运行的应用程序内。所述应用程序例如可以为手机淘宝、支付宝、手机天猫等。所述应用程序可以通过用户操作页面与终端设备的用户进行交互。所述用户操作页面可以向用户展示页面信息，并且可以从用户处获取用户下达的操作指令。例如在手机淘宝的用户操作页面上，可以向用户展示多个商品或者店铺的图片或者文字。用户通过终端设备的触摸屏或者鼠标等指令输入设备，可以向手机淘宝下达触控指令。在本实施方式中，当目标页面的内容需要被显示于终端设备的屏幕上时，终端设备的CPU可以对该目标页面对应的页面代码进行处理。具体地，所述目标页面的页面代码可以按照预设的路径存储于所述应用程序中，所述预设的路径例如可以指向所述应用程序的预设文件夹。所述终端设备的CPU可以通过所述预设的路径，对该预设的路径指向的文件夹中的内容进行读取，从而完成对所述目标页面对应的页面代码的加载过程。

在本实施方式中，所述终端设备的CPU从应用程序内加载目标页面的页面代码后，从而可以对加载的页面代码进行处理，将页面代码中编辑的信息通过图片或者文字等可视化的方式呈现给用户，从而形成了在用户操作页面上显示的页面信息。

在本实施方式中，所述页面代码中往往包含页面布局控件和页面元素，其中，所述页面元素可以为图片、文字、视频、按钮等需要在终端设备的屏幕上展示给用户观看的信息，同时，所述页面元素还可以包括用户显示视频的插件或者用于显示图片的插件等，这些插件尽管不会被用户观看到，但其也可以通过隐藏显示的方式存在于目标页面中。所述页面布局控件则可以视为盛放所述页面元素的容器，也就是说，所述页面元素可以被约束于某个页面布局控件中，而一个页面布局控件也可以约束于另一个页面布局控件中。例如，在一个页面代码的例子中，可以包括具备嵌套关系的第一页面布局控件和第二页面布局控件，其中所述第一页面布局控件在页面代码中定义的名称可以为c1，第二页面布局控件在页面代码中定义的名称可以为c2。在该页面代码中，c2页面布局控件嵌套于c1页面布局控件中，在c2页面布局控件中包含image和text这两个页面元素。这样，上述页面代码中的image和text可以被约束于c2页面布局控件中，而c2页面布局控件则可以被约束于c1页面布局控件中。在本实施方式中，在所述页面代码中可以包括具备嵌套关系的至少两个页面布局控件，例如上述的c1页面布局控件和c2页面布局控件。

步骤S13：确定所述页面代码中页面元素的位置信息，形成位置信息集。

在本实施方式中，所述页面布局控件和所述页面元素往往具备对应的参数，其中，所述页面布局控件的参数可以限定页面布局控件中页面元素的排列规则，所述排列规则可以通过预先规定的字符串以及预先规定的书写规则进行编写，所述排列规则可以包括从左向右横向排列或者从上到下纵向排列。例如，在步骤S11中所述的页面代码的例子中，c2页面布局控件的参数可以为style＝”flex-derection:row；”，其中，”flex-derection:row”可以为预先规定的与从左向右横向排列相对应的字符串，将该字符串衔接于style＝之后，便可以构成与预先规定的书写规则一致的短句，该短句便可以被终端设备的CPU进行识别，并且终端设备的CPU可以根据该短句对c2页面布局控件中的页面元素image和text进行从左向右横向排列。

在本实施方式中，所述页面布局控件的参数还可以在终端设备的屏幕上划定显示区域。终端设备屏幕上的显示区域可以通过像素点来表示。例如，终端设备的屏幕上具有1024*768个像素点，这些像素点可以呈行列分布，也就是说，该终端设备的屏幕上可以有1024行像素条，每行像素条中均有768个像素点，这样就在终端设备的屏幕上构成了1024*768个像素点。由于当前终端设备的屏幕往往为矩形，因此页面布局控件的参数在终端设备的屏幕上划定的显示区域也往往为矩形区域。通过在页面布局控件的参数中注明矩形区域四个顶点位置处的像素点，便可以确定该矩形区域的大小。

此外，在本实施方式中，所述终端设备屏幕上的显示区域还可以通过设置显示区域到屏幕边框的距离来确定。所述屏幕边框可以包括屏幕的上边框、下边框、左边框以及右边框，到所述屏幕边框的距离可以利用毫米或者吋等长度单位来表示。例如，所述终端设备屏幕上的某个显示区域的位置可以表示为：到上边框的距离为5毫米，到左边框的距离为3毫米，到右边框的距离为4毫米，到下边框的距离为3毫米，假设该终端设备屏幕的整体大小为：上下边框均为20毫米，左右边框均为50毫米，那么该显示区域的位置则可以限制在长为42毫米，宽为13毫米的矩形区域内。也就是说，通过设置到终端设备屏幕的四个边框的距离，也可以在所述终端设备的屏幕上确定显示区域的范围。

再者，在本实施方式中，还可以仅仅设置到所述终端设备屏幕的一个边框的距离来确定显示区域的范围，到所述终端设备屏幕的其它边框的距离可以进行缺省。例如，显示区域到终端设备屏幕的左边框的距离为5毫米，而显示区域到终端设备的上边框、下边框以及右边框的距离均进行了缺省，在这种情况下，可是视为所述显示区域的左边框到终端设备屏幕的左边框的距离为5毫米，而所述显示区域的其它边框可以与终端设备的上边框、下边框以及右边框对应重合。例如，终端设备的上下边框均为20毫米，左右边框均为50毫米，那么该显示区域的位置可以限制在长为50毫米，宽为15毫米的矩形区域内，也就是说，显示区域的左边框到终端设备屏幕的左边框的距离为5毫米，而所述显示区域的其它边框可以与终端设备的上边框、下边框以及右边框对应重合。通过这样的方法，也可以确定显示区域在终端设备的屏幕上的范围。

需要说明的是，如果页面布局控件的参数中没有注明用于在终端设备的屏幕上划定显示区域的参数，例如上述的页面代码中，c1页面布局控件和c2页面布局控件的参数中可以没有注明像素点或者距离值，此时则默认该页面布局控件划定的显示区域为终端设备的整个屏幕。也就是说，上述页面代码中c1页面布局控件和c2页面布局控件划定的显示区域均为终端设备的整个屏幕。

在本实施方式中，所述页面元素的参数可以包括页面元素的尺寸、链接或者颜色中的至少一种，也就是说，所述页面元素的参数可以限定页面元素在终端设备的屏幕上的显示方式。例如，在步骤S11中所述的页面代码的例子中，image的尺寸可以由宽(width)和高(height)限定，所述image的宽(width)可以为200像素，高(height)可以为200像素，这样，当所述image显示于终端设备的屏幕上时，便可以占据宽为200像素，高为200像素的矩形区域。另外，在上述的页面代码中，text中文字的颜色(color)可以为红色(#ff0000)，文字的尺寸(font-size)可以为48磅并且文字可以加粗(bold)，这样，根据text中文字的尺寸、字数以及是否加粗，便可以决定text中的文字在终端设备的屏幕上占据的区域。例如，假设text中每个文字的大小均相同并且均加粗，每个文字在终端设备的屏幕上所占的矩形区域可以为40像素*40像素，那么该text中如果共计10个文字，那么该text在终端设备的屏幕上所占的矩形区域便可以为40像素*400像素。

在本实施方式中，通过页面布局控件的参数，可以确定该页面布局控件在终端设备的屏幕上划定的显示区域以及页面元素在该显示区域中的排列方式。通过页面元素的参数，便可以确定页面元素的尺寸，从而可以确定页面元素在终端设备的屏幕上实际显示的位置。例如，在上述页面代码中，c1页面布局控件划定的显示区域为终端设备的整个屏幕，c2页面布局控件嵌套于c1页面布局控件中，划定的显示区域也为终端设备的整个屏幕，而在c2页面布局控件中具有image和text这两个页面元素，这两个页面元素的排列方式由c2页面布局控件的style参数决定，即从左向右横向排列。由image和text的参数可见，image的宽和高均为200像素，text中文字的颜色为红色(#ff0000)，文字的尺寸(font-size)为48磅并且文字被加粗(bold)。那么根据这些参数，首先可以确定image在终端设备的显示屏幕上所占的矩形区域，该矩形区域位于终端设备屏幕的左上角，其面积为200像素*200像素；接着，text中的文字所占的矩形区域可以位于image所占矩形区域的右侧，text中的文字所占的矩形区域可以通过text中文字的尺寸、字数以及是否加粗来决定。例如，假设text中每个文字的大小均相同并且均加粗，每个文字在终端设备的屏幕上所占的矩形区域可以为40像素*40像素，那么该text中如果共计10个文字，那么该text中的文字在终端设备的屏幕上所占的矩形区域便可以为40像素*400像素。也就是说，该text中的文字在终端设备的屏幕上所占的矩形区域位于image所占的矩形区域的右侧，其面积为40像素*400像素。

由上可见，在本实施方式中，根据页面代码中页面布局控件的参数以及页面元素的参数，可以确定所述页面代码中的页面元素在终端设备的屏幕上的位置信息。在本实施方式中，所述页面元素在终端设备的屏幕上占据的区域往往为矩形区域，那么所述页面元素的位置信息可以为所述矩形区域左上角顶点的坐标，当所述矩形区域左上角顶点的坐标确定后，便可以根据所述页面布局控件的参数限定的排列方式以及所述页面元素的参数限定的区域大小，确定所述矩形区域在终端设备的屏幕上的实际位置。例如，所述矩形区域左上角顶点的坐标为(3,5)，所述页面布局控件的参数限定的排列方式为从左向右横向排列，所述页面元素的参数限定的区域大小为长200像素，宽150像素，那么该矩形区域右上角顶点可以为(203,5)，左下角顶点可以为(3,155)，右下角顶点可以为(203,155)，这样，该矩形区域在终端设备屏幕上的实际位置便可以由这四个顶点的坐标来确定。在本实施方式中，所述矩形区域左上角顶点的坐标可以为所述页面元素在终端设备的屏幕上的起始坐标。通过确定所述页面元素的起始坐标，便可以确定所述页面元素在终端设备屏幕上的实际位置。因此，在本实施方式中，可以将将得到的所述页面元素在终端设备的屏幕上的起始坐标作为所述页面元素的位置信息。

在本实施方式中，由于一个矩形区域可以被该矩形区域中相对的两个顶点确定，因此在本实施方式中，所述位置信息集中还可以包括所述页面元素在所述终端设备的屏幕上的终止坐标。所述起始坐标可以为页面元素在终端设备的屏幕上所占的矩形区域的左上顶点位置处的坐标，而所述终止坐标可以为所述矩形区域右下顶点位置处的坐标，这样，所述起始坐标和所述终止坐标在所述终端设备的屏幕上限定的矩形区域便可以为所述页面元素在所述终端设备的屏幕上所占的区域，所述起始坐标和所述终止坐标为所述矩形区域的两个相对的顶点的坐标。

在本实施方式中，所述页面元素在终端设备屏幕上所占的矩形区域还可以通过该矩形区域到终端设备的屏幕边框的距离来确定。例如，所述屏幕边框可以包括屏幕的上边框、下边框、左边框以及右边框，到所述屏幕边框的距离可以利用毫米或者吋等长度单位来表示。例如，所述页面元素在终端设备屏幕上所占的矩形区域可以表示为：到上边框的距离为5毫米，到左边框的距离为3毫米，到右边框的距离为4毫米，到下边框的距离为3毫米，假设该终端设备屏幕的整体大小为：上下边框均为20毫米，左右边框均为50毫米，那么该矩形区域的位置则可以限制在长为42毫米，宽为13毫米的矩形区域内。也就是说，通过确定到终端设备的屏幕边框的距离，也可以在所述终端设备的屏幕上确定页面元素所占的矩形区域的范围。因此，在本实施方式中，所述页面元素的位置信息也可以包括所述页面元素到终端设备的屏幕边框的距离。需要说明的是，所述页面元素到终端设备的屏幕边框的距离可以包括所述页面元素到终端设备的屏幕的至少一个边框的距离。例如，在本实施方式中，可以仅仅设置到所述终端设备屏幕的一个边框的距离来确定所述页面元素在终端设备屏幕上所占的矩形区域的范围，到所述终端设备屏幕的其它边框的距离可以进行缺省。例如，所述页面元素到终端设备屏幕的左边框的距离为5毫米，到终端设备的上边框、下边框以及右边框的距离均进行了缺省，在这种情况下，可以视为所述页面元素的左边框到终端设备屏幕的左边框的距离为5毫米，而所述页面元素的其它边框可以与终端设备的上边框、下边框以及右边框对应重合。例如，终端设备的上下边框均为20毫米，左右边框均为50毫米，那么该页面元素的位置可以限制在长为50毫米，宽为15毫米的矩形区域内，也就是说，页面元素的左边框到终端设备屏幕的左边框的距离为5毫米，而所述页面元素的其它边框可以与终端设备的上边框、下边框以及右边框对应重合。通过这样的方法，也可以确定页面元素在终端设备的屏幕上所占矩形区域的范围。

在本实施方式中，所述位置信息可以通过数组的方式进行表示，所述数组中可以包括页面元素标识以及所述页面元素的位置标识。其中，所述页面元素标识可以按照页面元素的类型以及页面元素在页面代码中出现的顺序来进行确定。例如，在页面代码中包括图片和文字这两种类型的页面元素，其中，图片类型的页面元素有3个，文字类型的页面元素有两个，那么根据页面元素在页面代码中出现的顺序，可以将第一个图片类型的页面元素的标识确定为image1，依次类推，第二个和第三个图片类型的页面元素的标识可以确定为image2和image3，而文字类型的两个页面元素的标识可以分别为text1和text2。所述页面元素的位置标识即可以为上述的页面元素的起止坐标或者所述页面元素的起始坐标和终止坐标或者所述页面元素到终端设备的屏幕边框的距离中的至少一个。具体地，所述数组的表达形式可以为{页面元素标识，页面元素的位置标识}。例如，对于页面代码中的第二个图片类型的页面元素，其在终端设备的屏幕上的起始坐标为(10,20)，那么该页面元素的位置信息可以表示为{image2，(10,20)}。

在本实施方式中，当确定了各个页面元素的位置信息后，可以将确定的位置信息构成位置信息集。具体地，所述位置信息集中的位置信息可以通过堆栈的方式进行存储。其中，堆(heap)中的位置信息可以遵循先进先出的原则进行存储和读取，那么在通过堆(heap)的方式对所述位置信息集中的位置信息进行存储时，可以按照页面元素在页面代码中出现的顺序，对页面元素的位置信息依次存储。这样，在对页面元素的位置信息进行读取时，读取的顺序与页面元素在页面代码中出现的顺序是一致的。例如，所述位置信息集中包括页面元素image的位置信息和页面元素text的位置信息，所述页面元素image位于所述页面元素text之前，那么通过堆的方式对这两个页面元素的位置信息进行存储时，可以先存储image的位置信息，再存储text的位置信息，这样在后续从位置信息集中读取位置信息时，便可以先读取image的位置信息，再读取text的位置信息。而通过栈(stack)的方式对所述位置信息集中的位置信息进行存储时，由于栈中的位置信息可以遵循先进后出的原则进行存储和读取，因此可以按照页面元素在页面代码中出现的顺序，对页面元素的位置信息进行反序存储。这样，在对页面元素的位置信息进行读取时，读取的顺序与页面元素在页面代码中出现的顺序也可以保持一致。同样以上述的image和text这两个页面元素为例，在通过栈的方式对这两个页面元素的位置信息进行存储时，可以先存储text的位置信息，再存储image的位置信息，这样根据先进后出的原则，在后续从位置信息集中读取位置信息时，便可以先读取image的位置信息，再读取text的位置信息。

另外，在本实施方式中，所述位置信息集中的位置信息还可以通过树形结构的方式进行存储。具体地，所述树形结构中的各个位置信息可以根据页面元素在页面代码中出现的顺序从上到下依次排列。例如，所述位置信息集中包括页面元素image的位置信息和页面元素text的位置信息，所述页面元素image位于所述页面元素text之前，那么通过树形结构的方式对这两个页面元素的位置信息进行存储时，可以在树形结构的顶部存储image的位置信息，在所述image的位置信息下方可以存储text的位置信息。这样，在对所述位置信息集中的位置信息进行读取时，可以根据树形结构的排列顺序，依次读取所述树形结构中的各个位置信息。

步骤S15：在终端设备的屏幕上渲染至少一个预设页面布局控件，以及根据所述位置信息集将所述页面元素渲染在所述至少一个预设页面布局控件中。

在现有技术中往往将页面代码中出现的页面布局控件均在终端设备的屏幕上进行渲染，从而使得终端设备的CPU和内存被过度占用，以致在页面加载和页面滑动时产生顿卡的现象。为了避免这种影响用户体验的情况发生，在本实施方式中可以将页面代码中各个页面元素在终端设备的屏幕上所占的位置信息预先确定出来，从而可以将页面元素与页面布局控件相脱离，以减少在终端设备的屏幕上进行渲染的页面布局控件的数量。具体的，在本实施方式中，在确定出页面代码中各个页面元素在终端设备的屏幕上所占的位置信息后，可以预先确定至少一个预设页面布局控件。所述预设页面布局控件可以为所述页面代码中的页面布局控件，也可以是另外指定的页面布局控件，本申请对此并不做限定。

在本实施方式中，对所述预设页面布局控件进行渲染，可以指对所述预设页面布局控件的代码进行分析，从而确定所述预设页面布局控件在终端设备的屏幕上限定的显示区域，然后将该显示区域在终端设备的屏幕上进行显示的过程。对所述页面元素进行渲染，可以指从步骤S13中确定出的位置信息集中读取各个页面元素对应的位置信息，并根据所述位置信息确定页面元素在终端设备的屏幕上的实际位置，从而将该页面元素显示于终端设备的屏幕上的过程。

在本实施方式中，所述预设页面布局控件中可以包括所述页面代码中的页面元素，这样，所述页面代码中的页面元素便可以限定于所述预设页面布局控件中。例如，在步骤S11中所述的页面代码的例子中，在c1页面布局控件中嵌套了c2页面布局控件，由于这两个页面布局控件的参数中均没有对显示区域进行限定，因此这两个页面布局控件在终端设备的屏幕上限定的显示区域均为整个屏幕，也就是说，尽管c2页面布局控件嵌套于c1页面布局控件内，但实际上这两个页面布局控件在终端设备的屏幕上限定的显示区域是相同的。在c2页面布局控件中包含有image和text这两个页面元素，那么在将image和text显示于终端设备的屏幕上时，并不需要将c1页面布局控件和c2页面布局控件均在终端设备的屏幕上进行渲染，由于这两个页面布局控件中均包含了该页面代码中所有的页面元素(image和text)，那么便可以从c1页面布局控件和c2页面布局控件中选择一个在终端设备的屏幕上进行渲染，从而减少在渲染过程中对终端设备的CPU和内存的占用率。

在本实施方式中，所述预设页面布局控件中可以包括页面代码中的页面元素，例如上述的c1页面布局控件和c2页面布局控件中均包括该页面代码中的页面元素(image和text)，因此c1页面布局控件和c2页面布局控件均可以作为所述预设页面布局控件。然而某些页面代码中，不同的页面布局控件可以包括不同的页面元素。例如，在某个页面代码中，id为c3的页面布局控件限定的显示区域为终端设备的整个屏幕，在c3页面布局控件中内嵌了c4页面布局控件和c5页面布局控件。其中，c4页面布局控件和c5页面布局控件将终端设备的屏幕等分为左半边屏幕和右半边屏幕，c4页面布局控件限定的显示区域可以为终端设备的左半边屏幕，c5页面布局控件限定的显示区域可以为终端设备的右半边屏幕。在c4页面布局控件中包括页面元素image1和text1，在c5页面布局控件中包括页面元素image2和text2。这样，在该页面代码中包括3个页面布局控件以及4个页面元素，而只有c3页面布局控件中包括该页面代码的所有页面元素(image1，text1，image2，text2)，c4页面布局控件和c5页面布局控件均包含该页面代码中的部分页面元素，因此在该页面代码中，可以将c3页面布局控件作为预设页面布局控件，还可以将c4和c5这两个页面布局控件同时作为预设页面布局控件，这样该页面代码中的image1，text1，image2以及text2这4个页面元素就可以在预设页面布局控件中显示。

在本实施方式中，在确定所述页面代码中的页面元素在终端设备的屏幕上的位置信息集以及确定所述预设页面布局控件之后，便可以在终端设备的屏幕上渲染所述预设页面布局控件以及所述页面元素。在步骤S11中所述的页面代码的例子中，c1页面布局控件作为预设页面布局控件可以被渲染于终端设备的屏幕上，c1页面布局控件限定的显示区域为终端设备的整个屏幕。在c1页面布局控件中，页面元素image和text被从左向右横向排列，因此页面元素image和text可以根据在位置信息集中的对应的位置信息，被渲染至所述c1页面布局控件中，从而可以完成对页面代码的处理过程。在实际应用场景中，c1页面布局控件尽管被渲染至终端设备的屏幕上，但其并不会被用户查看到，用户在终端设备的屏幕上只会看到页面元素image和text。

由上可见，根据本申请提供的一种页面代码的处理方法，在终端设备的屏幕上最终只会渲染预设页面布局控件和页面代码中的页面元素，对于页面代码中多余的页面布局控件并不会进行渲染，从而降低了终端设备的CPU和内存的占用率，使得页面在加载或者滑动时可以更加顺畅，不会产生卡顿的现象。

在一个具体的应用场景中，在手机淘宝中的一个页面对应的页面代码中，可以包括具备嵌套关系的第一页面布局控件和第二页面布局控件，其中所述第一页面布局控件在页面代码中定义的名称可以为c1，第二页面布局控件在页面代码中定义的名称可以为c2。在该页面代码中，c2页面布局控件嵌套于c1页面布局控件中，在c2页面布局控件中包含image和text这两个页面元素。c2页面布局控件的参数可以为style＝”flex-derection:row；”，其中，”flex-derection:row”可以为预先规定的与从左向右横向排列相对应的字符串。所述c1页面布局控件和c2页面布局控件划定的显示区域可以为终端设备的整个屏幕。image的宽和高均可以为200像素，text中文字的颜色可以为红色(#ff0000)，文字的尺寸(font-size)可以为48磅并且文字可以被加粗(bold)。

在这种情况下，终端设备的CPU可以预先从手机淘宝中加载该页面代码，在处理该页面代码时，可以预先确定该页面代码中的页面元素image和text在终端设备的屏幕上的位置信息。具体地，c1页面布局控件划定的显示区域为终端设备的整个屏幕，c2页面布局控件嵌套于c1页面布局控件中，划定的显示区域也为终端设备的整个屏幕，而在c2页面布局控件中具有image和text这两个页面元素，这两个页面元素的排列方式由c2页面布局控件的style参数决定，即从左向右横向排列。由image和text的参数可见，image的宽和高均为200像素，text中文字的颜色为红色(#ff0000)，文字的尺寸(font-size)为48磅并且文字被加粗(bold)，那么根据这些参数，首先可以确定image在终端设备的显示屏幕上所占的矩形区域，该矩形区域位于终端设备屏幕的左上角，其面积为200像素*200像素；接着，text中的文字所占的矩形区域可以位于image所占矩形区域的右侧，text中的文字所占的矩形区域可以通过text中文字的尺寸、字数以及是否加粗来决定。例如，假设text中每个文字的大小均相同并且均加粗，每个文字在终端设备的屏幕上所占的矩形区域可以为40像素*40像素，那么该text中如果共计10个文字，那么该text中的文字在终端设备的屏幕上所占的矩形区域便可以为40像素*400像素。也就是说，该text中的文字在终端设备的屏幕上所占的矩形区域位于image所占的矩形区域的右侧，其面积为40像素*400像素。

在确定了上述页面代码中页面元素image和text在终端设备的屏幕上的位置信息后，可以从所述页面代码中确定预设页面布局控件。由于在该页面代码中，c1页面布局控件和c2页面布局控件中均包括了页面元素image和text，因此可以从这两个页面布局控件中确定任一页面布局控件，以作为所述预设页面布局控件。例如，可以将c1页面布局控件确定为预设页面布局控件，从而可以将c1页面布局控件和image、text渲染至终端设备的屏幕上。其中，c1页面布局控件尽管被渲染至终端设备的屏幕上，但其并不会被用户查看到，用户在终端设备的屏幕上只会看到页面元素image和text。

请参阅图2，在一个实施方式中，页面元素在终端设备的屏幕上占据的显示区域往往为矩形区域，假设该矩形区域的左上角顶点的位置被确定了，便可以根据页面元素的参数，进一步确定该矩形区域所占的范围。因此，在本实施方式中，步骤S13具体可以包括以下几个步骤。

步骤S31：根据所述页面代码中所述页面布局控件的参数以及所述页面元素的参数，确定所述页面元素在终端设备的屏幕上的起始坐标；

步骤S33：将得到的所述页面元素在终端设备的屏幕上的起始坐标作为所述页面元素的位置信息，形成位置信息集。

在本实施方式中，所述终端设备屏幕上的每个像素点可以对应着一个唯一的坐标。通过该坐标便可以对各个像素点进行定位。目前，由于终端设备的屏幕往往为矩形，因此像素点在屏幕中的位置可以通过横向编号和纵向编号来确定。在本实施方式中，可以将屏幕左上角的像素点的横向编号设置为1，纵向编号同样为1，在横向方向和纵向方向的编号可以从1开始分别依次递增。这样，(1,1)便可以作为屏幕左上角的像素点的坐标，其中，第一个1为该像素点的横向编号，第二个1为该像素点的纵向编号。对于1024*768的屏幕而言，屏幕右下角的像素点的坐标可以为(768,1024)，屏幕右上角的像素点的坐标可以为(768,1)，屏幕左下角的像素点的坐标可以为(1,1024)。

在本实施方式中，可以将所述页面元素在终端设备的屏幕上所占的矩形区域的左上角顶点的坐标作为所述页面元素在终端设备的屏幕上的起始坐标。具体地，通过页面布局控件的参数，可以确定该页面布局控件在终端设备的屏幕上划定的显示区域以及页面元素在该显示区域中的排列方式。通过页面元素的参数，便可以确定页面元素的尺寸，从而可以确定页面元素在终端设备的屏幕上实际显示的位置。例如，在步骤S11中所述的页面代码的例子中，c2页面布局控件划定的显示区域为终端设备的整个屏幕，并且该页面布局控件中的image和text的排列方式为从左向右横向排列。在本实施方式中，image和text在终端设备的屏幕上所占的区域均可以为矩形。对于image而言，其宽为200像素，高也为200像素，因此该image在终端设备的屏幕上占据的是200像素*200像素的矩形区域。由于c2页面布局控件划定的显示区域为终端设备的整个屏幕，因此image在终端设备屏幕上显示的矩形区域的左上角像素点可以为(1,1)，那么坐标(1,1)便可以作为页面元素image在终端设备的屏幕上的起始坐标。该image在终端设备的屏幕上占据的是200像素*200像素的矩形区域，并且该image遵循从左向右横向排列的方式，这样，在所述页面元素对应的起始坐标确定后，便可以确定image在终端设备的屏幕上所占的矩形区域。

在本实施方式中，由于c2页面布局控件中页面元素的排列方式为从左向右横向排列，因此text的内容可以显示于image的右侧。在上述的页面代码中，text的参数限定了text中文字的字体大小、字体是否加粗以及字体的颜色和背景色，这样，可以根据text中文字的字数、文字的大小以及文字是否加粗，决定text中的文字在终端设备的屏幕上占据的区域。例如，假设text中每个文字的大小均相同并且均加粗，每个文字在终端设备的屏幕上所占的矩形区域可以为40像素*40像素，那么该text中如果共计10个文字，那么该text在终端设备的屏幕上所占的矩形区域便可以为40像素*400像素。由于text的内容位于image的右侧，因此text在终端设备屏幕上显示的矩形区域的左上角像素点可以为(201,1)，那么坐标(201,1)便可以作为页面元素text在终端设备的屏幕上的起始坐标。再根据该text在终端设备的屏幕上所占的矩形区域为40像素*400像素以及从左向右横向排列的方式，从而可以确定该text的内容在终端设备的屏幕上所占的矩形区域。

由上可见，在本实施方式中，通过确定页面代码中的页面元素在终端设备的屏幕上对应的起始坐标，从而能够在终端设备的屏幕上确定页面元素在终端设备的屏幕上所占的矩形区域。那么，在确定了页面代码中各个页面元素对应的起始坐标后，便可以将得到的所述页面元素在终端设备的屏幕上的起始坐标作为所述页面元素的位置信息，从而可以形成位置信息集。具体地，所述位置信息可以通过数组的方式进行表示并且所述位置信息集中的位置信息可以通过堆栈的方式或者树形结构的方式进行存储，具体的实现方式与步骤S13中的描述一致，这里便不再赘述。

在一个实施方式中，由于一个矩形区域可以被该矩形区域中相对的两个顶点确定，因此在本实施方式中，所述位置信息集中除了所述起始坐标之外，还可以包括所述页面元素在所述终端设备的屏幕上的终止坐标。其中，所述起始坐标可以为页面元素在终端设备的屏幕上所占的矩形区域的左上顶点位置处的坐标，而所述终止坐标可以为所述矩形区域右下顶点位置处的坐标，这样，所述起始坐标和所述终止坐标在所述终端设备的屏幕上限定的矩形区域便可以为所述页面元素在所述终端设备的屏幕上所占的区域，所述起始坐标和所述终止坐标为所述矩形区域的两个相对的顶点的坐标。具体地，在本实施方式中，可以根据所述页面元素的起始坐标以及所述页面元素的参数，确定所述页面元素在终端设备的屏幕上的终止坐标。以步骤S11中的页面代码为例，页面显示元素image的起始坐标可以为(1,1)，而该image在终端设备的屏幕上占据的是200像素*200像素的矩形区域，那么可以确定该image在终端设备的屏幕上的终止坐标可以为(200,200)。在本实施方式中，在确定所述页面元素在终端设备的屏幕上的终止坐标后，可以将所述起始坐标和所述终止坐标作为所述页面元素的位置信息，从而形成所述页面元素的位置信息集。具体地，所述位置信息可以通过数组的方式进行表示并且所述位置信息集中的位置信息可以通过堆栈的方式或者树形结构的方式进行存储，具体的实现方式与步骤S13中的描述一致，这里便不再赘述。

这样，在本实施方式中，通过两个起始坐标和终止坐标便可以确定出页面元素在终端设备的屏幕上的位置，从而节省了终端设备的CPU在计算页面元素的位置时所需的开销，减轻了终端设备的运算压力。

请参阅图3。在一个实施方式中，所述页面元素在终端设备屏幕上所占的矩形区域还可以通过该矩形区域到终端设备的屏幕边框的距离来确定，因此，在本实施方式中，步骤S13具体可以包括以下几个步骤。

步骤S311：根据所述页面元素的参数，确定所述页面元素与终端设备的屏幕边框之间的距离信息；其中，所述距离信息中包括所述页面元素到所述终端设备的屏幕的至少一个边框的距离；

步骤S313：将得到的所述页面元素与终端设备的屏幕边框之间的距离信息作为所述页面元素的位置信息，形成位置信息集。

在本实施方式中，所述页面元素在终端设备屏幕上所占的矩形区域可以通过该矩形区域到终端设备的屏幕边框的距离信息来确定。所述距离信息可以包括所述页面元素到终端设备屏幕的至少一个边框的距离，所述距离可以利用毫米或者吋等长度单位来表示。例如，在本实施方式中，可以仅仅设置到所述终端设备屏幕的一个边框的距离来确定所述页面元素在终端设备屏幕上所占的矩形区域的范围，到所述终端设备屏幕的其它边框的距离可以进行缺省。例如，所述页面元素到终端设备屏幕的左边框的距离为5毫米，到终端设备的上边框、下边框以及右边框的距离均进行了缺省，在这种情况下，可以视为所述页面元素的左边框到终端设备屏幕的左边框的距离为5毫米，而所述页面元素的其它边框可以与终端设备的上边框、下边框以及右边框对应重合。当然，所述距离信息还可以包括页面元素到终端设备的四个边框的距离，例如，所述页面元素在终端设备屏幕上所占的矩形区域可以表示为：到终端设备屏幕的上边框的距离为5毫米，到左边框的距离为3毫米，到右边框的距离为4毫米，到下边框的距离为3毫米，假设该终端设备屏幕的整体大小为：上下边框均为20毫米，左右边框均为50毫米，那么该矩形区域的位置则可以限制在长为42毫米，宽为13毫米的矩形区域内。这样，通过确定到终端设备的屏幕边框的距离，从而可以在所述终端设备的屏幕上确定页面元素所占的矩形区域的范围。

在本实施方式中，可以将得到的所述页面元素与终端设备的屏幕边框之间的距离信息作为所述页面元素的位置信息。具体地，所述位置信息可以通过数组的方式进行表示并且所述位置信息集中的位置信息可以通过堆栈的方式或者树形结构的方式进行存储，具体的实现方式与步骤S13中的描述一致，这里便不再赘述。

在一个实施方式中，由于在页面代码中页面布局控件往往逐层嵌套，例如步骤S11中的页面代码的例子中，c2页面布局控件就是嵌套于c1页面布局控件中，那么下一层页面布局控件中的页面元素也往往包含于上一层的页面布局控件中，例如，c2页面布局控件中的image和text这两个页面元素也包含于c1页面布局控件中。因此，为了能够正确地从众多的页面布局控件中确定出预设页面布局控件，可以首先确定出页面代码中的第一个页面元素，那么包含所述第一个页面元素的页面布局控件中则可以包含该页面代码中的所有页面元素。请参阅图4，在本实施方式中，在终端设备上渲染至少一个预设页面布局控件的步骤具体可以包括以下几个步骤。

步骤S51：确定所述页面代码中的第一个页面元素；

步骤S53：将所述页面代码中包含所述第一个页面元素的页面布局控件确定为候选页面布局控件；

步骤S55：从所述候选页面布局控件中选择任一页面布局控件，并将选择的所述页面布局控件渲染至终端设备的屏幕上。

在本实施方式中，可以对页面代码中的字符串进行逐行扫描，并识别出该页面代码中的第一个页面元素。具体的，可以通过将页面代码中的字符串与预设的页面元素字符串进行对比，所述预设的页面元素字符串例如可以为image或者text，在对比后，可以从所述页面代码中确定与所述预设的页面元素字符串相匹配的字符串。例如，对于步骤S11中的页面代码而言，该页面代码中与预设的页面元素字符串相匹配的字符串有image和text。在从所述页面代码中确定与所述预设的页面元素字符串相匹配的字符串之后，可以记录确定的所述字符串在所述页面代码中的行号。例如，假设上述的image在页面代码中的行号为3，text所在的行号为4。接着，在本实施方式中可以通过对比记录的行号，便可以将记录的所述行号中最小的行号对应的页面元素确定为所述页面代码中的第一个页面元素。也就是说，在步骤S11中的页面代码中，记录的行号中最小的行号为3，而该行号对应的页面元素为image，因此image可以作为该页面代码中的第一个页面元素。

在本实施方式中，确定出页面代码中的第一个页面元素后，便可以将包含所述第一个页面元素的页面布局控件确定为候选页面布局控件。例如，在步骤S11中的页面代码的例子中，由于c2页面布局控件嵌套于c1页面布局控件中，因此c1页面布局控件与c2页面布局控件中均包括所述第一个页面元素image，这样，c1页面布局控件与c2页面布局控件均可以被确定为候选页面布局控件。在本实施方式中，为了避免在终端设备的屏幕上渲染多个页面布局控件，可以从所述候选页面布局控件中选择任一页面布局控件，并将选择的所述页面布局控件作为所述页面代码的预设页面布局控件。这样，通过对页面代码中第一个页面元素的行号进行确定，从而可以准确地获取页面代码中包含所有页面元素的页面布局控件，进一步地便可以确定所述预设页面布局控件。

在一个实施方式中，为了更加快速地确定所述预设页面布局控件，并且减少终端设备的CPU的运算压力，可以将所述页面代码中的第一个页面布局控件确定为所述页面代码的预设页面布局控件。这样处理的原因在于，页面代码中后续的页面布局控件往往嵌套于第一个页面布局控件中，那么后续页面布局控件中的页面元素也往往包含于第一个页面布局控件中，因此可以直接将第一个页面布局控件确定为该页面代码中的预设页面布局控件，以避免复杂的运算过程，减轻终端设备的CPU的运算压力，同时也提高了确定目标页面布局控件的速度。

在一个实施方式中，在页面代码中，某些页面元素的参数中会添加“doLayout＝true”的字符串。该字符串往往是调试人员为了测试该页面元素的布局是否正确而添加的，在实际应用场景中，携带有该字符串的页面元素在终端设备的屏幕上往往是不显示的。因此，在本实施方式中，在步骤S15之前，可以判断所述页面元素的参数中是否包含预设字符串。此处的所述预设字符串便可以为“doLayout＝true”字符串。当所述页面元素的参数中包含该预设字符串时，则不在终端设备的屏幕上显示该页面元素。这样，在本实施方式中，可以在终端设备的屏幕上渲染至少一个预设页面布局控件，以及根据所述位置信息集将所述页面元素的参数中不包含所述预设字符串的页面元素渲染在所述至少一个预设页面布局控件中。

请参阅图5。本申请还提供一种页面代码的处理装置。如图5所示，所述装置可以包括页面代码加载单元100，位置信息集确定单元200以及渲染单元300。

其中，所述页面代码加载单元100可以用于加载目标页面的页面代码；其中所述页面代码包括具备嵌套关系的至少两个页面布局控件，其中所述页面布局控件中包括有页面元素；

所述位置信息集确定单元200可以用于确定所述页面代码中页面元素的位置信息，形成位置信息集；

所述渲染单元300可以用于在终端设备的屏幕上渲染至少一个预设页面布局控件，以及根据所述位置信息集将所述页面元素渲染在所述至少一个预设页面布局控件中。

在本申请一实施方式中，所述位置信息集确定单元200可以包括起始坐标确定模块201，用于根据所述页面代码中所述页面布局控件的参数以及所述页面元素的参数，确定所述页面元素在终端设备的屏幕上的起始坐标；位置信息集构成模块202，用于将得到的所述页面元素在终端设备的屏幕上的起始坐标作为所述页面元素的位置信息，形成位置信息集。

在本申请一实施方式中，所述渲染单元300可以包括页面元素确定模块301，用于确定所述页面代码中的第一个页面元素；候选页面布局控件确定模块302，用于将所述页面代码中包含所述第一个页面元素的页面布局控件确定为候选页面布局控件；预设页面布局控件选择模块303，用于从所述候选页面布局控件中选择任一页面布局控件，并将选择的所述页面布局控件渲染至终端设备的屏幕上。

需要说明的是，上述各个功能模块的具体实现过程均与上述方法步骤中的描述一致，这里便不再赘述。

请参阅图6。本申请还提供一种页面代码的处理设备。如图6所示，所述设备可以包括显示屏幕10，存储器20以及处理器30。

其中，所述存储器20可以存储目标页面的页面代码；

所述处理器30可以从所述存储器20中加载所述目标页面的页面代码；其中所述页面代码包括具备嵌套关系的至少两个页面布局控件，其中所述页面布局控件中包括有页面元素；确定所述页面代码中页面元素的位置信息，形成位置信息集；在所述显示屏幕10上渲染至少一个预设页面布局控件，以及根据所述位置信息集将所述页面元素渲染在所述至少一个预设页面布局控件中。

本申请实施方式提供的一种页面代码的处理方法、装置及设备，在终端设备的屏幕上最终只会渲染目标页面布局控件和页面代码中的页面元素，对于页面代码中多余的页面布局控件并不会进行渲染，从而降低了终端设备的CPU和内存的占用率，使得页面在加载或者滑动时可以更加顺畅，不会产生卡顿的现象。

上面对本申请的各种实施方式的描述以描述的目的提供给本领域技术人员。其不旨在是穷举的、或者不旨在将本申请限制于单个公开的实施方式。如上所述，本申请的各种替代和变化对于上述技术所属领域技术人员而言将是显而易见的。因此，虽然已经具体讨论了一些另选的实施方式，但是其它实施方式将是显而易见的，或者本领域技术人员相对容易得出。本申请旨在包括在此已经讨论过的本申请的所有替代、修改、和变化，以及落在上述申请的精神和范围内的其它实施方式。

在20世纪90年代，对于一个技术的改进可以很明显地区分是硬件上的改进(例如，对二极管、晶体管、开关等电路结构的改进)还是软件上的改进(对于方法流程的改进)。然而，随着技术的发展，当今的很多方法流程的改进已经可以视为硬件电路结构的直接改进。设计人员几乎都通过将改进的方法流程编程到硬件电路中来得到相应的硬件电路结构。因此，不能说一个方法流程的改进就不能用硬件实体模块来实现。例如，可编程逻辑器件(Programmable Logic Device,PLD)(例如现场可编程门阵列(Field Programmable GateArray，FPGA))就是这样一种集成电路，其逻辑功能由用户对器件编程来确定。由设计人员自行编程来把一个数字系统“集成”在一片PLD上，而不需要请芯片制造厂商来设计和制作专用的集成电路芯片2。而且，如今，取代手工地制作集成电路芯片，这种编程也多半改用“逻辑编译器(logic compiler)”软件来实现，它与程序开发撰写时所用的软件编译器相类似，而要编译之前的原始代码也得用特定的编程语言来撰写，此称之为硬件描述语言(Hardware Description Language，HDL)，而HDL也并非仅有一种，而是有许多种，如ABEL(Advanced Boolean Expression Language)、AHDL(Altera Hardware Description Language)、Confluence、CUPL(Cornell University Programming Language)、HDCal、JHDL(Java HardwareDescription Language)、Lava、Lola、MyHDL、PALASM、RHDL(Ruby Hardware DescriptionLanguage)等，目前最普遍使用的是VHDL(Very-High-Speed Integrated Circuit HardwareDescription Language)与Verilog2。本领域技术人员也应该清楚，只需要将方法流程用上述几种硬件描述语言稍作逻辑编程并编程到集成电路中，就可以很容易得到实现该逻辑方法流程的硬件电路。

上述实施方式阐明的装置、模块或单元，具体可以由计算机芯片或实体实现，或者由具有某种功能的产品来实现。

为了描述的方便，描述以上装置时以功能分为各种单元分别描述。当然，在实施本申请时可以把各单元的功能在同一个或多个软件和/或硬件中实现。

通过以上的实施方式的描述可知，本领域的技术人员可以清楚地了解到本申请可借助软件加必需的通用硬件平台的方式来实现。基于这样的理解，本申请的技术方案本质上或者说对现有技术做出贡献的部分可以以软件产品的形式体现出来，该计算机软件产品可以存储在存储介质中，如ROM/RAM、磁碟、光盘等，包括若干指令用以使得一台计算机设备(可以是个人计算机，服务器，或者网络设备等)执行本申请各个实施方式或者实施方式的某些部分所述的方法。

本说明书中的各个实施方式均采用递进的方式描述，各个实施方式之间相同相似的部分互相参见即可，每个实施方式重点说明的都是与其他实施方式的不同之处。尤其，对于设备和装置的实施方式而言，由于其基本相似于方法实施方式，所以描述的比较简单，相关之处参见方法实施方式的部分说明即可。

本申请可用于众多通用或专用的计算机系统环境或配置中。例如：个人计算机、服务器计算机、手持设备或便携式设备、平板型设备、多处理器系统、基于微处理器的系统、置顶盒、可编程的消费电子设备、网络PC、小型计算机、大型计算机、包括以上任何系统或设备的分布式计算环境等等。

本申请可以在由计算机执行的计算机可执行指令的一般上下文中描述，例如程序模块。一般地，程序模块包括执行特定任务或实现特定抽象数据类型的例程、程序、对象、组件、数据结构等等。也可以在分布式计算环境中实践本申请，在这些分布式计算环境中，由通过通信网络而被连接的远程处理设备来执行任务。在分布式计算环境中，程序模块可以位于包括存储设备在内的本地和远程计算机存储介质中。

虽然通过实施方式描绘了本申请，本领域普通技术人员知道，本申请有许多变形和变化而不脱离本申请的精神，希望所附的权利要求包括这些变形和变化而不脱离本申请的精神。

Claims (10)

1.一种页面代码的处理方法，其特征在于，包括：

加载目标页面的页面代码；其中所述页面代码包括具备嵌套关系的至少两个页面布局控件，其中所述页面布局控件中包括有页面元素；

确定所述页面代码中页面元素的位置信息，形成位置信息集；

在终端设备的屏幕上渲染至少一个预设页面布局控件，以及根据所述位置信息集将所述页面元素渲染在所述至少一个预设页面布局控件中。

2.根据权利要求1所述的页面代码的处理方法，其特征在于，确定所述页面代码中页面元素的位置信息，形成位置信息集包括：

根据所述页面代码中所述页面布局控件的参数以及所述页面元素的参数，确定所述页面元素在终端设备的屏幕上的起始坐标；

将得到的所述页面元素在终端设备的屏幕上的起始坐标作为所述页面元素的位置信息，形成位置信息集。

3.根据权利要求2所述的页面代码的处理方法，其特征在于，所述位置信息集中还包括所述页面元素在所述终端设备的屏幕上的终止坐标，

相应地，在确定所述页面元素在终端设备的屏幕上的起始坐标之后，所述方法还包括：

根据所述页面元素的起始坐标以及所述页面元素的参数，确定所述页面元素在终端设备的屏幕上的终止坐标；其中，所述起始坐标和所述终止坐标在所述终端设备的屏幕上限定的矩形区域为所述页面元素在所述终端设备的屏幕上所占的区域，所述起始坐标和所述终止坐标为所述矩形区域的两个相对的顶点的坐标。

4.根据权利要求1所述的页面代码的处理方法，其特征在于，确定所述页面代码中页面元素的位置信息，形成位置信息集包括：

根据所述页面元素的参数，确定所述页面元素与终端设备的屏幕边框之间的距离信息；其中，所述距离信息中包括所述页面元素到所述终端设备的屏幕的至少一个边框的距离；

将得到的所述页面元素与终端设备的屏幕边框之间的距离信息作为所述页面元素的位置信息，形成位置信息集。

5.根据权利要求1所述的页面代码的处理方法，其特征在于，所述在终端设备上渲染至少一个预设页面布局控件具体包括：

确定所述页面代码中的第一个页面元素；

将所述页面代码中包含所述第一个页面元素的页面布局控件确定为候选页面布局控件；

从所述候选页面布局控件中选择任一页面布局控件，并将选择的所述页面布局控件渲染至终端设备的屏幕上。

6.根据权利要求5所述的页面代码的处理方法，其特征在于，确定所述页面代码中的第一个页面元素具体包括：

从所述页面代码中确定与预设的页面元素字符串相匹配的字符串并记录确定的所述字符串在所述页面代码中的行号；

将记录的所述行号中最小的行号对应的页面元素确定为所述页面代码中的第一个页面元素。

7.根据权利要求1所述的页面代码的处理方法，其特征在于，所述在终端设备的屏幕上渲染至少一个预设页面布局控件具体包括：

将所述页面代码中的第一个页面布局控件作为所述预设页面布局控件渲染于终端设备的屏幕上。

8.根据权利要求1所述的页面代码的处理方法，其特征在于，在所述在终端设备的屏幕上渲染至少一个预设页面布局控件，以及根据所述位置信息集将所述页面元素渲染在所述至少一个预设页面布局控件中的步骤之前，所述方法还包括：

判断所述页面元素的参数中是否包含预设字符串；

相应地，在终端设备的屏幕上渲染至少一个预设页面布局控件，以及根据所述位置信息集将所述页面元素渲染在所述至少一个预设页面布局控件中具体包括：

在终端设备的屏幕上渲染至少一个预设页面布局控件，以及根据所述位置信息集将所述页面元素的参数中不包含所述预设字符串的页面元素渲染在所述至少一个预设页面布局控件中。

9.一种页面代码的处理装置，其特征在于，包括：

页面代码加载单元，用于加载目标页面的页面代码；其中所述页面代码包括具备嵌套关系的至少两个页面布局控件，其中所述页面布局控件中包括有页面元素；

位置信息集确定单元，用于确定所述页面代码中页面元素的位置信息，形成位置信息集；

渲染单元，用于在终端设备的屏幕上渲染至少一个预设页面布局控件，以及根据所述位置信息集将所述页面元素渲染在所述至少一个预设页面布局控件中。

10.一种页面代码的处理设备，其特征在于，包括：

显示屏幕；

存储器，其用于存储目标页面的页面代码；

处理器，其从所述存储器中加载所述目标页面的页面代码；其中所述页面代码包括具备嵌套关系的至少两个页面布局控件，其中所述页面布局控件中包括有页面元素；确定所述页面代码中页面元素的位置信息，形成位置信息集；在所述显示屏幕上渲染至少一个预设页面布局控件，以及根据所述位置信息集将所述页面元素渲染在所述至少一个预设页面布局控件中。