CN109213957A - 一种页面嵌套环境中获取子页面尺寸的方法及终端 - Google Patents

Abstract

本发明提供一种页面嵌套环境中获取子页面尺寸的方法及终端，通过在子页面中为带有子页面宽或高的显示元素添加标记属性，所述标记属性包含显示元素的宽或高信息，然后获取子页面中包含所述标记属性的所有显示元素，并根据标记属性获取每一个显示元素对应的宽或高，根据所有显示元素中最大的宽和高分别设置所述子页面的宽和高；可以过滤掉大部分的显示元素，避免在页面嵌套环境中，比如iframe嵌套环境中因遍历子页面所有的显示元素而消耗巨大的CPU和内存，即使在复杂的页面环境下，也能够实现高效地获取子页面的尺寸信息，提高了用户体验。

Description

一种页面嵌套环境中获取子页面尺寸的方法及终端

技术领域

本发明涉及计算机软件领域，尤其涉及一种页面嵌套环境中获取子页面尺寸的方法及终端。

背景技术

在现代的网站中，经常出现一个页面通过iframe嵌入其他页面的情况，这种架构下，经常需要涉及到主页面需要获取子页面的宽高以解决各种问题，比如用于解决多滚条问题。但是由于浏览器安全性限制，外部页面无法直接访问子页面获得其宽高信息，业界常见的方法是：子页面通过定时器，遍历所有显示元素，计算出宽度值和高度值，然后通过postMessage方法将宽高信息发送给主页面，但是这种方法有以下几个缺点：

1、在复杂的页面环境下，页面的显示元素非常多，遍历所有显示元素需要消耗巨大CPU和内存，非常影响用户体验。

2、在复杂的业务环境中，常规的方法无法获取到真实的尺寸，例如通过CSS(层叠样式表)进行3D变换后的显示元素，就无法取到其尺寸。

3、在复杂的使用场景中，用户需要对页面真实尺寸进行自定义，比如在多个iframe连续嵌套的页面中，用户希望iframe之间存在一定的间隔，这个时候如果仅仅计算iframe的间隔，就无法实现上述功能。

发明内容

本发明所要解决的技术问题是：提供一种页面嵌套环境中获取子页面尺寸的方法及终端，能够实现高效地获取子页面的尺寸信息。

为了解决上述技术问题，本发明采用的一种技术方案为：

一种页面嵌套环境中获取子页面尺寸的方法，包括步骤：

S1、在子页面中为带有子页面宽或高的显示元素添加标记属性，所述标记属性包含显示元素的宽或高信息；

S2、获取子页面中包含所述标记属性的所有显示元素，并根据标记属性获取每一个显示元素对应的宽或高，根据所有显示元素中最大的宽和高分别设置所述子页面的宽和高。

为了解决上述技术问题，本发明采用的另一种技术方案为：

一种页面嵌套环境中获取子页面尺寸的终端，包括存储器、处理器及存储在存储器上并可在处理器上运行的计算机程序，所述处理器执行所述计算机程序时实现以下步骤：

S1、在子页面中为带有子页面宽或高的显示元素添加标记属性，所述标记属性包含显示元素的宽或高信息；

S2、获取子页面中包含所述标记属性的所有显示元素，并根据标记属性获取每一个显示元素对应的宽或高，根据所有显示元素中最大的宽和高分别设置所述子页面的宽和高。

本发明的有益效果在于：通过在子页面中为带有子页面宽或高的显示元素添加标记属性，所述标记属性包含显示元素的宽或高信息，然后获取子页面中包含所述标记属性的所有显示元素，并根据标记属性获取每一个显示元素对应的宽或高，根据所有显示元素中最大的宽和高分别设置所述子页面的宽和高；可以过滤掉大部分的显示元素，避免在页面嵌套环境中，比如iframe嵌套环境中因遍历子页面所有的显示元素而消耗巨大的CPU和内存，即使在复杂的页面环境下，也能够实现高效地获取子页面的尺寸信息，提高了用户体验。

附图说明

图1为本发明实施例的页面嵌套环境中获取子页面尺寸的方法的流程图；

图2为本发明实施例的页面嵌套环境中获取子页面尺寸的终端的结构示意图；

图3为本发明实施例的页面嵌套环境中获取子页面尺寸的方法的细节流程图；

图4为本发明实施例的页面嵌套环境中获取子页面尺寸的方法用于调整子页面尺寸的具体示例图。

标号说明：

1、页面嵌套环境中获取子页面尺寸的终端；2、存储器；3、处理器。

具体实施方式

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

本发明最关键的构思在于:通过在子页面中为带有子页面宽或高的显示元素中添加带有子页面宽或高信息的标记属性，根据所述标记属性实现高效地获取子页面的尺寸信息。

请参照图1、图3和图4，一种页面嵌套环境中获取子页面尺寸的方法，包括步骤：

S1、在子页面中为带有子页面宽或高的显示元素添加标记属性，所述标记属性包含显示元素的宽或高信息；

S2、获取子页面中包含所述标记属性的所有显示元素，并根据标记属性获取每一个显示元素对应的宽或高，根据所有显示元素中最大的宽和高分别设置所述子页面的宽和高。

从上述描述可知，本发明的有益效果在于：通过在子页面中为带有子页面宽或高的显示元素添加标记属性，所述标记属性包含显示元素的宽或高信息，然后获取子页面中包含所述标记属性的所有显示元素，并根据标记属性获取每一个显示元素对应的宽或高，根据所有显示元素中最大的宽和高分别设置所述子页面的宽和高；可以过滤掉大部分的显示元素，避免在页面嵌套环境中，比如iframe嵌套环境中因遍历子页面所有的显示元素而消耗巨大的CPU和内存，即使在复杂的页面环境下，也能够实现高效地获取子页面的尺寸信息，提高了用户体验。

进一步的，所述步骤S2中根据所有显示元素中最大的宽和高分别设置所述子页面的宽和高包括：

预设子页面的宽和高，将所述预设的子页面的宽和高与所有显示元素中最大的宽和高分别进行比较，将其中最大的宽和高分别设置为所述子页面的宽和高。

由上述描述可知，通过预设子页面的宽和高，可以实现在某些无法通过常规方法直接对显示元素计算高度的情况下，提供一种自由的定制化能力。

进一步的，所述步骤S2具体为：

获取子页面中包含所述标记属性的所有显示元素，判断获取到的子页面的所有显示元素的标记属性的集合中是否仅包含一个边的尺寸信息，所述边为宽或高；

若是，则根据集合中仅包含的一个边的尺寸信息的最大值设置所述子页面对应边的尺寸信息，对于子页面的另一个边的尺寸信息，则根据系统的计算进行设置；

反之，则根据标记属性获取每一个显示元素对应的宽或高，将所有显示元素中最大的宽和高分别设置为所述子页面的宽和高。

由上述描述可知，在获取到的子页面的所有显示元素的标记属性的集合中仅包含一个边的尺寸信息时，通过系统计算来补充另一个边的尺寸信息，提高了获取子页面尺寸信息的灵活性。

进一步的，所述步骤S2根据所有显示元素中最大的宽和高分别设置所述子页面的宽和高包括：

将所有显示元素中最大的宽和高分别增加预设值，并将增加预设值之后的宽和高分别设置为所述子页面的宽和高。

由上述描述可知，通过对子页面的宽高增加预设值，可以限制子页面的宽高至少是预设值尺寸，并且可以根据业务需求，适应性修改子页面的尺寸信息，提高了调整子页面尺寸的灵活性。

进一步的，所述步骤S2之后，还包括步骤：

S3、将所述设置的子页面的宽和高发送给父页面。

从上述描述可知，通过将所述设置的子页面的宽和高发送给父页面，以实现父页面获取子页面的宽和高信息。

请参照图2，一种页面嵌套环境中获取子页面尺寸的终端，包括存储器、处理器及存储在存储器上并可在处理器上运行的计算机程序，所述处理器执行所述计算机程序时实现以下步骤：

S1、在子页面中为带有子页面宽或高的显示元素添加标记属性，所述标记属性包含显示元素的宽或高信息；

S2、获取子页面中包含所述标记属性的所有显示元素，并根据标记属性获取每一个显示元素对应的宽或高，根据所有显示元素中最大的宽和高分别设置所述子页面的宽和高。

从上述描述可知，本发明的有益效果在于：通过在子页面中为带有子页面宽或高的显示元素添加标记属性，所述标记属性包含显示元素的宽或高信息，然后获取子页面中包含所述标记属性的所有显示元素，并根据标记属性获取每一个显示元素对应的宽或高，根据所有显示元素中最大的宽和高分别设置所述子页面的宽和高；可以过滤掉大部分的显示元素，避免在页面嵌套环境中，比如iframe嵌套环境中因遍历子页面所有的显示元素而消耗巨大的CPU和内存，即使在复杂的页面环境下，也能够实现高效地获取子页面的尺寸信息，提高了用户体验。

进一步的，所述步骤S2中根据所有显示元素中最大的宽和高分别设置所述子页面的宽和高包括：

预设子页面的宽和高，将所述预设的子页面的宽和高与所有显示元素中最大的宽和高分别进行比较，将其中最大的宽和高分别设置为所述子页面的宽和高。

由上述描述可知，通过预设子页面宽和高，可以实现在某些无法通过常规方法直接对显示元素计算高度的情况下，提供一种自由的定制化能力。

进一步的，所述步骤S2具体为：

获取子页面中包含所述标记属性的所有显示元素，判断获取到的子页面的所有显示元素的标记属性的集合中是否仅包含一个边的尺寸信息，所述边为宽或高；

若是，则根据集合中仅包含的一个边的尺寸信息的最大值设置所述子页面对应边的尺寸信息，对于子页面的另一个边的尺寸信息，则根据系统的计算进行设置；

反之，则根据标记属性获取每一个显示元素对应的宽或高，将所有显示元素中最大的宽和高分别设置为所述子页面的宽和高。

由上述描述可知，在获取到的子页面的所有显示元素的标记属性的集合中仅包含一个边的尺寸信息时，通过系统计算来补充另一个边的尺寸信息，提高了获取子页面尺寸信息的灵活性。

进一步的，所述步骤S2根据所有显示元素中最大的宽和高分别设置所述子页面的宽和高包括：

将所有显示元素中最大的宽和高分别增加预设值，并将增加预设值之后的宽和高分别设置为所述子页面的宽和高。

由上述描述可知，通过对子页面的宽高增加预设值，可以限制子页面的宽高至少是预设值尺寸，并且可以根据业务需求，适应性修改子页面的尺寸信息，提高了子页面尺寸的灵活性。

进一步的，所述步骤S2之后，还包括步骤：

S3、将所述设置的子页面的宽和高发送给父页面。

从上述描述可知，通过将所述设置的子页面的宽和高发送给父页面，以实现父页面获取子页面的宽和高信息。

请参照图1，本发明的实施例一为：

S1、在子页面中为带有子页面宽或高的显示元素添加标记属性，所述标记属性可根据实际情况进行设定，此处将标记属性定义为data-iframe-resizer，所述标记属性包含显示元素的宽(w)或高(h)信息，即可以有如下三种情况：一、只包含宽信息；二、只包含高信息；三、宽和高信息都包含；

在子页面首次加载时，定义两个全局变量：页面高度(pageHeight)和页面宽度(pageWidth)，设置所述页面高度(pageHeight)和页面宽度(pageWidth)初始值为0，同时启动一个定时器，所述定时器每隔一段时间执行步骤S2；

S2、获取子页面中包含所述标记属性(data-iframe-resizer)的所有显示元素，并根据标记属性获取每一个显示元素对应的宽(w)或高(h)，根据所有显示元素中最大的宽(w)和高(h)分别设置所述子页面的宽和高；

如下述代码所示：

获取包含“data-iframe-resizer”属性的元素，也就是3个div；然后由于内容为123的div中包含宽度属性(w)，因此计算内容为123的div的宽度，满足条件则赋值给pageWidth；同理，对内容为456的div计算高度，满足条件则赋值给pageHeight；对内容为789的div，计算高度和宽度，比较内容为789的div的宽度与pageWidth的大小，取两者中较大者作为pageWidth的值，比较内容为789的div的长度与pageHeight，取两者中较大者作为pageHeight的值。

进一步的，所述S2具体包括：

S21、查找所有包含标记属性(data-iframe-resizer)的显示元素；

S22、遍历查找结果的每个显示元素；

S220、判断当前显示元素是否存在高(h)属性，

若存在，则执行S221，

否则，则执行S23；

S221、将页面高度(pageHeight)与高(h)属性的最大值赋值给页面高度(pageHeight)；

S23、判断当前显示元素是否存在宽(w)属性，

若存在，则执行S231，

否则，则执行S232；

S231、将页面宽度(pageWidth)与宽(w)属性的最大值赋值给页面宽度(pageWidth)；

S232、判断查找结果是否遍历结束，

若否，则返回S22，

否则，执行S3；

S3、将所述设置的子页面的宽和高发送给父页面。

请参照图1，本发明的实施例二为：

S1、在子页面中为带有子页面宽或高的显示元素添加标记属性，所述标记属性可根据实际情况进行设定，此处将标记属性定义为data-iframe-resizer，所述标记属性包含显示元素的宽(w)或高(h)信息，即可以有如下三种情况：一、只包含宽信息；二、只包含高信息；三、宽和高信息都包含；

在子页面首次加载时，定义两个全局变量：页面高度(pageHeight)和页面宽度(pageWidth)，设置所述页面高度(pageHeight)和页面宽度(pageWidth)初始值为0，同时启动一个定时器，所述定时器每隔一段时间执行步骤S2；

S2、获取子页面中包含所述标记属性(data-iframe-resizer)的所有显示元素，并根据标记属性获取每一个显示元素对应的宽(w)或高(h)，根据所有显示元素中最大的宽(w)和高(h)分别设置所述子页面的宽和高；

进一步的，所述S2具体包括：

S21、查找所有包含标记属性(data-iframe-resizer)的显示元素；

S22、遍历查找结果的每个显示元素；

S220、判断当前显示元素是否存在高(h)属性，

若存在，则执行S221，

否则，则执行S23；

S221、将页面高度(pageHeight)与高(h)属性的最大值赋值给页面高度(pageHeight)；

S23、判断当前显示元素是否存在宽(w)属性，

若存在，则执行S231，

否则，则执行S232；

S231、将页面宽度(pageWidth)与宽(w)属性的最大值赋值给页面宽度(pageWidth)；

S232、判断查找结果是否遍历结束，

若否，则返回S22，

否则，执行S25；

S25、判断子页面是否存在用于预设子页面的宽(width)、高(height)的全局函数，所述全局函数可以根据实际情况进行设定，此处将全局函数定义为“getIframeSize”；

若存在，则执行S26，

否则，则执行S3；

S26、预设子页面的宽(width)和高(height)，将所述预设的子页面的宽和高与所有显示元素中最大的宽和高分别进行比较，将其中最大的宽和高分别设置为所述子页面的宽和高；

进一步的，所述S26具体包括：

S261、判断预设的子页面的宽(width)是否大于页面宽度(pageWidth)，

若是，则执行S262，

否则，则执行S263；

S262、将预设的子页面的宽(width)赋值给页面宽度(pageWidth)；

S263、判断预设的子页面的高(height)是否大于页面高度(pageHeight)，

若是，则执行S264，

否则，则执行S3；

S264、将预设的子页面的高赋值给页面高度(pageHeight)，

S3、将所述设置的子页面的宽和高发送给父页面。

请参照图1，本发明的实施例三为：

S1、在子页面中为带有子页面宽或高的显示元素添加标记属性，所述标记属性可根据实际情况进行设定，此处将标记属性定义为data-iframe-resizer，所述标记属性包含显示元素的宽(w)或高(h)信息，即可以有如下三种情况：一、只包含宽信息；二、只包含高信息；三、宽和高信息都包含；

在子页面首次加载时，定义两个全局变量：页面高度(pageHeight)和页面宽度(pageWidth)，设置所述页面高度(pageHeight)和页面宽度(pageWidth)初始值为0，同时启动一个定时器，所述定时器每隔一段时间执行步骤S2；

S2、获取子页面中包含所述标记属性(data-iframe-resizer)的所有显示元素，并根据标记属性获取每一个显示元素对应的宽(w)或高(h)，根据所有显示元素中最大的宽(w)和高(h)分别设置所述子页面的宽和高；

进一步的，所述S2具体包括：

S21、查找所有包含标记属性(data-iframe-resizer)的显示元素；

S22、遍历查找结果的每个显示元素；

S220、判断当前显示元素是否存在高(h)属性，

若存在，则执行S221，

否则，则执行S23；

S221、将页面高度(pageHeight)与高(h)属性的最大值赋值给页面高度(pageHeight)；

S23、判断当前显示元素是否存在宽(w)属性，

若存在，则执行S231，

否则，则执行S232；

S231、将页面宽度(pageWidth)与宽(w)属性的最大值赋值给页面宽度(pageWidth)；

S232、判断查找结果是否遍历结束，

若否，则返回S22，

否则，执行S24；

S24、判断获取到的子页面的所有显示元素的标记属性的集合中是否仅包含一个边的尺寸信息，所述边为宽或高；

若是，则执行S241，

否则，则执行S3；

S241、根据集合中仅包含的一个边的尺寸信息的最大值设置所述子页面对应边的尺寸信息，对于子页面的另一个边的尺寸信息，则根据系统的计算进行设置；

S3、将所述设置的子页面的宽和高发送给父页面。

请参照图1、图4，本发明的实施例四为：

S1、在子页面中为带有子页面宽或高的显示元素添加标记属性，所述标记属性可根据实际情况进行设定，此处将标记属性定义为data-iframe-resizer，所述标记属性包含显示元素的宽(w)或高(h)信息，即可以有如下三种情况：一、只包含宽信息；二、只包含高信息；三、宽和高信息都包含；

在子页面首次加载时，定义两个全局变量：页面高度(pageHeight)和页面宽度(pageWidth)，设置所述页面高度(pageHeight)和页面宽度(pageWidth)初始值为0，同时启动一个定时器，所述定时器每隔一段时间执行步骤S2；

S2、获取子页面中包含所述标记属性(data-iframe-resizer)的所有显示元素，并根据标记属性获取每一个显示元素对应的宽(w)或高(h)，根据所有显示元素中最大的宽(w)和高(h)分别设置所述子页面的宽和高；

进一步的，所述S2具体包括：

S21、查找所有包含标记属性(data-iframe-resizer)的显示元素；

S22、遍历查找结果的每个显示元素；

S220、判断当前显示元素是否存在高(h)属性，

若存在，则执行S221，

否则，则执行S23；

S221、将页面高度(pageHeight)与高(h)属性的最大值赋值给页面高度(pageHeight)；

S23、判断当前显示元素是否存在宽(w)属性，

若存在，则执行S231，

否则，则执行S232；

S231、将页面宽度(pageWidth)与宽(w)属性的最大值赋值给页面宽度(pageWidth)；

S232、判断查找结果是否遍历结束，

若否，则返回S22，

否则，执行S25；

S25、判断子页面是否存在用于预设子页面的宽(width)、高(height)的全局函数，所述全局函数可以根据实际情况进行设定，此处将全局函数定义为“getIframeSize”；

若存在，则执行S26，

否则，则执行S3；

S26、将所有显示元素中最大的宽和高分别增加预设值，并将增加预设值之后的宽和高分别设置为所述子页面的宽和高；

S3、将所述设置的子页面的宽和高发送给父页面。

将上述子页面调整预设尺寸应用于具体场景中，

根据上述代码所示，在原来子页面页高的基础上增加10像素，在原来子页面页宽的基础上增加20像素，可以实现不论之前计算的页面宽、高为多少，其子页面的高至少为10，宽至少为20，提高了调整子页面尺寸的灵活性；

将上述为子页面调整预设尺寸应用于具体场景中，如图4所示：

在父页面A中嵌套子页面B与子页面C，子页面C相对设置于子页面B下方，此时子页面C与父页面A页面底部的距离为20像素，显得不够美观，因此对子页面B的高预设增加20像素，使子页面C的底端与父页面A重合，使整体的页面更加美观；

在另一种场景中，针对子页面B经常刷新高度的情况，如果经常刷新，则子页面C的位置则需要一直变化，此时若给B设置足够大的值，即相当于在子页面B和子页面C之间设置一隐形的间隔，则不管子页面B如何改变高度，都能够固定子页面C的位置，而不需要对子页面C的位置进行变动。

请参照图1、图3，本发明实施例5为：

一种页面嵌套环境中获取子页面尺寸的方法，包括步骤：

S1、在子页面中为带有子页面宽或高的显示元素添加标记属性，所述标记属性可根据实际情况进行设定，此处将标记属性定义为data-iframe-resizer，所述标记属性包含显示元素的宽(w)或高(h)信息；在子页面首次加载时，定义两个全局变量：页面高度(pageHeight)和页面宽度(pageWidth)，设置所述页面高度(pageHeight)和页面宽度(pageWidth)初始值为0，同时启动一个定时器，所述定时器每隔一段时间执行步骤S2；

S2、获取子页面中包含所述标记属性(data-iframe-resizer)的所有显示元素，并根据标记属性获取每一个显示元素对应的宽(w)或高(h)，根据所有显示元素中最大的宽(w)和高(h)分别设置所述子页面的宽和高；

进一步的，所述S2具体包括：

S20、判断子页面中是否存在标记属性(data-iframe-resizer)，

(在此说明一下，由于父页面嵌套的子页面的显示元素可能较少，因此，在此情况下，则没有必要在子页面的显示元素中添加标记属性增加业务负担)，

若不存在，则执行S201；

否则，则执行S21，

S201、通过系统计算出子页面的宽高信息，并执行步骤S25，

系统计算出子页面的宽高具体为：

通过“window.documentbody.clientHeight”计算出子页面的高，

通过“window.document.body.clientWidth”计算出子页面的宽。

S21、则查找所有包含标记属性(data-iframe-resizer)的显示元素；

S22、遍历查找结果的每个显示元素；

S220、判断当前显示元素是否存在高(h)属性，

若存在，则执行S221，

否则，则执行S23；

S221、将页面高度(pageHeight)与高(h)属性的最大值赋值给页面高度(pageHeight)；

S23、判断当前显示元素是否存在宽(w)属性，

若存在，则执行S231，

否则，则执行S232；

S231、将页面宽度(pageWidth)与宽(w)属性的最大值赋值给页面宽度(pageWidth)；

S232、判断查找结果是否遍历结束，

若否，则返回S22，

否则，执行S24；

S24、判断获取到的子页面的所有显示元素的标记属性的集合中是否仅包含一个边的尺寸信息，所述边为宽或高；

若是，则执行S241，

否则，则执行S25；

S241、根据集合中仅包含的一个边的尺寸信息的最大值设置所述子页面对应边的尺寸信息，对于子页面的另一个边的尺寸信息，则根据系统的计算进行设置；

S25、判断子页面是否存在用于预设子页面的宽(width)、高(height)全局函数，所述全局函数可以根据实际情况进行设定，此处将全局函数定义为“getIframeSize”；

若存在，则执行S26，

否则，则执行S3；

S26、预设子页面的宽和高，将所述预设的子页面的宽和高与所有显示元素中最大的宽和高分别进行比较，将其中最大的宽和高分别设置为所述子页面的宽和高；

进一步的，所述S26具体包括：

S261、判断预设的子页面的宽(width)是否大于页面宽度(pageWidth)，

若是，则执行S262，

否则，则执行S263；

S262、将预设的子页面的宽(width)赋值给页面宽度(pageWidth)；

S263、判断预设的子页面的高(height)是否大于页面高度(pageHeight)，

若是，则执行S264，

否则，则执行S3；

S264、将预设的子页面的高赋值给页面高度(pageHeight)，

S3、将所述设置的子页面的宽和高发送给父页面。

进一步的，所述S26中对子页面的宽和高进行的预设可以根据业务需求选择其他的方案来灵活替换，

比如可以将所有显示元素中最大的宽和高分别增加预设值，并将增加预设值之后的宽和高分别设置为所述子页面的宽和高。

请参照图2，本发明的实施例六为：

一种页面嵌套环境中获取子页面尺寸的终端1，包括存储器2、处理器3以及存储在所述存储器2上并可在所述处理器3上运行的计算机程序，所述处理器3执行所述计算机程序时实现实施例一中的各个步骤。

请参照图2，本发明的实施例七为：

一种页面嵌套环境中获取子页面尺寸的终端1，包括存储器2、处理器3以及存储在所述存储器2上并可在所述处理器3上运行的计算机程序，所述处理器3执行所述计算机程序时实现实施例二中的各个步骤。

请参照图2，本发明的实施例八为：

一种页面嵌套环境中获取子页面尺寸的终端1，包括存储器2、处理器3以及存储在所述存储器2上并可在所述处理器3上运行的计算机程序，所述处理器3执行所述计算机程序时实现实施例三中的各个步骤。

请参照图2，本发明的实施例九为：

一种页面嵌套环境中获取子页面尺寸的终端1，包括存储器2、处理器3以及存储在所述存储器2上并可在所述处理器3上运行的计算机程序，所述处理器3执行所述计算机程序时实现实施例四中的各个步骤。

请参照图2，本发明的实施例十为：

一种页面嵌套环境中获取子页面尺寸的终端1，包括存储器2、处理器3以及存储在所述存储器2上并可在所述处理器3上运行的计算机程序，所述处理器3执行所述计算机程序时实现实施例五中的各个步骤。

综上所述，本发明提供的一种页面嵌套环境中获取子页面尺寸的方法及终端，通过在子页面中为带有子页面宽或高的显示元素添加标记属性，所述标记属性包含显示元素的宽或高信息，然后获取子页面中包含所述标记属性的所有显示元素，并根据标记属性获取每一个显示元素对应的宽或高，根据所有显示元素中最大的宽和高分别设置所述子页面的宽和高；可以过滤掉大部分的显示元素，避免在页面嵌套环境中，比如iframe嵌套环境中因遍历子页面所有的显示元素而消耗巨大的CPU和内存，即使在复杂的页面环境下，也能够实现高效地获取子页面的尺寸信息，提高了用户体验；通过预设子页面宽和高，可以实现在某些无法通过常规方法直接对显示元素计算高度的情况下，比如页面显示元素的旋转等情况，提供一种自由的定制化能力，或是对子页面调整预设的宽和高，可以实现定制化地调整子页面宽、高尺寸以满足不同的业务需求；在获取到的子页面的所有显示元素的标记属性的集合中仅包含一个边的尺寸信息时，通过系统计算来补充另一个边的尺寸信息，提高了获取子页面尺寸信息的灵活性；在页面嵌套环境中，子页面的显示元素如果减少，可以直接使用系统计算子页面的尺寸，减少人工设置标记属性的业务量，同时也提高了获取子页面尺寸的灵活性。

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

Claims (10)

1.一种页面嵌套环境中获取子页面尺寸的方法，其特征在于，包括步骤：

S1、在子页面中为带有子页面宽或高的显示元素添加标记属性，所述标记属性包含显示元素的宽或高信息；

S2、获取子页面中包含所述标记属性的所有显示元素，并根据标记属性获取每一个显示元素对应的宽或高，根据所有显示元素中最大的宽和高分别设置所述子页面的宽和高。

2.根据权利要求1所述的页面嵌套环境中获取子页面尺寸的方法，其特征在于，所述步骤S2中根据所有显示元素中最大的宽和高分别设置所述子页面的宽和高包括：

预设子页面的宽和高，将所述预设的子页面的宽和高与所有显示元素中最大的宽和高分别进行比较，将其中最大的宽和高分别设置为所述子页面的宽和高。

3.根据权利要求1所述的页面嵌套环境中获取子页面尺寸的方法，其特征在于，所述步骤S2具体为：

获取子页面中包含所述标记属性的所有显示元素，判断获取到的子页面的所有显示元素的标记属性的集合中是否仅包含一个边的尺寸信息，所述边为宽或高；

若是，则根据集合中仅包含的一个边的尺寸信息的最大值设置所述子页面对应边的尺寸信息，对于子页面的另一个边的尺寸信息，则根据系统的计算进行设置；

反之，则根据标记属性获取每一个显示元素对应的宽或高，将所有显示元素中最大的宽和高分别设置为所述子页面的宽和高。

4.根据权利要求1所述的页面嵌套环境中获取子页面尺寸的方法，其特征在于，所述步骤S2根据所有显示元素中最大的宽和高分别设置所述子页面的宽和高包括：

将所有显示元素中最大的宽和高分别增加预设值，并将增加预设值之后的宽和高分别设置为所述子页面的宽和高。

5.根据权利要求1所述的页面嵌套环境中获取子页面尺寸的方法，其特征在于，所述步骤S2之后，还包括步骤：

S3、将所述设置的子页面的宽和高发送给父页面。

6.一种页面嵌套环境中获取子页面尺寸的终端，包括存储器、处理器及存储在存储器上并可在处理器上运行的计算机程序，其特征在于，所述处理器执行所述计算机程序时实现以下步骤：

S1、在子页面中为带有子页面宽或高的显示元素添加标记属性，所述标记属性包含显示元素的宽或高信息；

S2、获取子页面中包含所述标记属性的所有显示元素，并根据标记属性获取每一个显示元素对应的宽或高，根据所有显示元素中最大的宽和高分别设置所述子页面的宽和高。

7.根据权利要求6所述的页面嵌套环境中获取子页面尺寸的终端，其特征在于，所述步骤S2中根据所有显示元素中最大的宽和高分别设置所述子页面的宽和高包括：

预设子页面的宽和高，将所述预设的子页面的宽和高与所有显示元素中最大的宽和高分别进行比较，将其中最大的宽和高分别设置为所述子页面的宽和高。

8.根据权利要求6所述的页面嵌套环境中获取子页面尺寸的终端，其特征在于，所述步骤S2具体为：

获取子页面中包含所述标记属性的所有显示元素，判断获取到的子页面的所有显示元素的标记属性的集合中是否仅包含一个边的尺寸信息，所述边为宽或高；

若是，则根据集合中仅包含的一个边的尺寸信息的最大值设置所述子页面对应边的尺寸信息，对于子页面的另一个边的尺寸信息，则根据系统的计算进行设置；

反之，则根据标记属性获取每一个显示元素对应的宽或高，将所有显示元素中最大的宽和高分别设置为所述子页面的宽和高。

9.根据权利要求6所述的页面嵌套环境中获取子页面尺寸的终端，其特征在于，所述步骤S2根据所有显示元素中最大的宽和高分别设置所述子页面的宽和高包括：

将所有显示元素中最大的宽和高分别增加预设值，并将增加预设值之后的宽和高分别设置为所述子页面的宽和高。

10.根据权利要求6所述的页面嵌套环境中获取子页面尺寸的终端，其特征在于，所述步骤S2之后，还包括步骤：

S3、将所述设置的子页面的宽和高发送给父页面。