CN103365861A - 用于在移动设备上显示网页的方法和系统 - Google Patents

Abstract

本发明涉及移动计算，其中公开了一种用于在移动设备上显示网页的方法，包括：获取网页中具有快速访问属性的UI元素；利用具有快速访问属性的UI元素产生快速访问面板；其中，产生的快速访问面板的透明度不低于预定的阈值。利用本发明实施例提供的上述一个或多个实施例，能够有效解决现有技术中存在的上述缺点，达到提高用户利用平板电子设备进行网页浏览时与平板电子设备交互的效率。

Description

用于在移动设备上显示网页的方法和系统

技术领域

本发明的实施方式一般涉及移动计算，更具体地，涉及一种用于在移动设备上显示网页的方法和系统。

背景技术

随着具有触摸式屏幕作为输入设备的移动设备的普及随之开发了多种适于平板电子设备的应用。与传统电子设备使用键盘、鼠标等输入设备不同，具有触摸式屏幕作为输入设备的移动设备需要用户通过手指对屏幕操作进行输入。也就是说，用户往往需要在手持移动设备的同时对其进行操作，如果移动设备的触摸式屏幕具有大尺寸，那么频繁的移动手指的位置来进行输入的方式往往多有不便。上述问题在利用具有触摸式屏幕作为输入设备的移动设备进行网页浏览时变得尤为突出，因为网页浏览需要用户与移动设备进行大量交互，因而效率往往不高。

发明内容

本发明说明性实施例中认识到现有技术中存在的上述缺点。为此，本公开提供了克服现有技术中一个或多个上述缺点的技术方案。

根据本发明的一个实施例，提供了一种用于在移动设备上显示网页的方法，包括：获取网页中具有快速访问属性的UI元素；利用具有快速访问属性的UI元素产生快速访问面板，其中产生的快速访问面板的透明度不低于预定的阈值。

根据本发明的另一实施例，用于在移动设备上显示网页的方法进一步包括：响应于检测到特定手势的输入，将快速访问面板的透明度设置为低于预定的阈值。

根据本发明的一个实施例，提供了一种用于在移动设备上显示网页的系统，包括：获取单元，配置为获取网页中具有快速访问属性的UI元素；产生单元，配置为利用具有快速访问属性的UI元素产生快速访问面板，其中产生的快速访问面板的透明度不低于预定的阈值。

根据本发明的另一实施例，还包括设置单元，配置为响应于检测到特定手势的输入将快速访问面板的透明度设置为低于预定的阈值。

此外，本发明的实施例还提供了与上述方法对应的计算机程序产品。

利用本发明实施例提供的上述一个或多个实施例，能够有效解决现有技术中存在的上述缺点，达到提高用户利用移动设备进行网页浏览时的效率。

附图说明

通过结合附图对本公开示例性实施方式进行更详细的描述，本公开的上述以及其它目的、特征和优势将变得更加明显，其中，在本公开示例性实施方式中，相同的参考标号通常代表相同部件。

图1显示了适于用来实现本发明实施方式的示例性计算系统100的框图；

图2显示了根据本发明一个实施例的用于在移动设备上显示网页的方法200的流程图；

图3显示了根据本发明一个实施例的用于在移动设备上显示网页的系统300的框图；

图4a-4b显示了示例性的网页代码对应的DOM树结构以及遍历该DOM树结构的顺序。

具体实施方式

下面将参照附图更详细地描述本公开的优选实施方式。虽然附图中显示了本公开的优选实施方式，然而应该理解，可以以各种形式实现本公开而不应被这里阐述的实施方式所限制。相反，提供这些实施方式是为了使本公开更加透彻和完整，并且能够将本公开的范围完整的传达给本领域的技术人员。

图1显示了适于用来实现本发明实施方式的示例性计算系统100的框图。如图1所示，计算机系统100可以包括：CPU(中央处理单元)101、RAM(随机存取存储器)102、ROM(只读存储器)103、系统总线104、硬盘控制器105、键盘控制器106、串行接口控制器107、并行接口控制器108、显示控制器109、硬盘110、键盘111、串行外部设备112、并行外部设备113和显示器114。在这些设备中，与系统总线104耦合的有CPU 101、RAM 102、ROM 103、硬盘控制器105、键盘控制器106、串行控制器107、并行控制器108和显示控制器109。硬盘110与硬盘控制器105耦合，键盘111与键盘控制器106耦合，串行外部设备112与串行接口控制器107耦合，并行外部设备113与并行接口控制器108耦合，以及显示器114与显示控制器109耦合。应当理解，图1所述的结构框图仅仅是为了示例的目的，而不是对本发明范围的限制。在某些情况下，可以根据具体情况增加或减少某些设备。

所属技术领域的技术人员知道，本公开可以实现为系统、方法或计算机程序产品。因此，本公开可以具体实现为以下形式，即：可以是完全的硬件、也可以是完全的软件(包括固件、驻留软件、微代码等)，还可以是硬件和软件结合的形式，本文一般称为“电路”、“模块”或“系统”。此外，在一些实施例中，本公开还可以实现为在一个或多个计算机可读介质中的计算机程序产品的形式，该计算机可读介质中包含计算机可读的程序代码。

可以采用一个或多个计算机可读的介质的任意组合。计算机可读介质可以是计算机可读信号介质或者计算机可读存储介质。计算机可读存储介质例如可以是——但不限于——电、磁、光、电磁、红外线、或半导体的系统、装置或器件，或者任意以上的组合。计算机可读存储介质的更具体的例子(非穷举的列表)包括：具有一个或多个导线的电连接、便携式计算机磁盘、硬盘、随机存取存储器(RAM)、只读存储器(ROM)、可擦式可编程只读存储器(EPROM或闪存)、光纤、便携式紧凑磁盘只读存储器(CD-ROM)、光存储器件、磁存储器件、或者上述的任意合适的组合。在本文件中，计算机可读存储介质可以是任何包含或存储程序的有形介质，该程序可以被指令执行系统、装置或者器件使用或者与其结合使用。

计算机可读的信号介质可以包括在基带中或者作为载波一部分传播的数据信号，其中承载了计算机可读的程序代码。这种传播的数据信号可以采用多种形式，包括——但不限于——电磁信号、光信号或上述的任意合适的组合。计算机可读的信号介质还可以是计算机可读存储介质以外的任何计算机可读介质，该计算机可读介质可以发送、传播或者传输用于由指令执行系统、装置或者器件使用或者与其结合使用的程序。

计算机可读介质上包含的程序代码可以用任何适当的介质传输，包括——但不限于——无线、电线、光缆、RF等等，或者上述的任意合适的组合。

可以以一种或多种程序设计语言或其组合来编写用于执行本发明操作的计算机程序代码，所述程序设计语言包括面向对象的程序设计语言—诸如Java、Smalltalk、C++，还包括常规的过程式程序设计语言—诸如”C”语言或类似的程序设计语言。程序代码可以完全地在用户计算机上执行、部分地在用户计算机上执行、作为一个独立的软件包执行、部分在用户计算机上部分在远程计算机上执行、或者完全在远程计算机或服务器上执行。在涉及远程计算机的情形中，远程计算机可以通过任意种类的网络—包括局域网(LAN)或广域网(WAN)—连接到用户计算机，或者，可以连接到外部计算机(例如利用因特网服务提供商来通过因特网连接)。

下面将参照本发明实施例的方法、装置(系统)和计算机程序产品的流程图和/或框图描述本发明。应当理解，流程图和/或框图的每个方框以及流程图和/或框图中各方框的组合，都可以由计算机程序指令实现。这些计算机程序指令可以提供给通用计算机、专用计算机或其它可编程数据处理装置的处理器，从而生产出一种机器，这些计算机程序指令通过计算机或其它可编程数据处理装置执行，产生了实现流程图和/或框图中的方框中规定的功能/操作的装置。

也可以把这些计算机程序指令存储在能使得计算机或其它可编程数据处理装置以特定方式工作的计算机可读介质中，这样，存储在计算机可读介质中的指令就产生出一个包括实现流程图和/或框图中的方框中规定的功能/操作的指令装置(instruction means)的制造品(manufacture)。

也可以把计算机程序指令加载到计算机、其它可编程数据处理装置、或其它设备上，使得在计算机、其它可编程数据处理装置或其它设备上执行一系列操作步骤，以产生计算机实现的过程，从而使得在计算机或其它可编程装置上执行的指令能够提供实现流程图和/或框图中的方框中规定的功能/操作的过程。

下面参看图2，其中显示了根据本发明一个实施例的用于在移动设备上显示网页的方法200的流程图。如图2所示，根据本发明一个实施例的用于在移动设备上显示网页的方法200从步骤202开始。然后，方法200进入步骤204，其中获取网页中具有快速访问属性的用户界面(UI)元素。通常，UI元素的快速访问属性指该UI元素所对应的动作和/或事件，包括但不限于快速访问键(包括快速访问的特定键组合)、点击、焦点、选择、是否可映射、是否可拖拽等。根据本发明的一个实施例，可以定义一个用于侦听网页加载事件的函数，该函数可以响应于加载网页代码执行。根据本发明的一个实施例，该函数首先解析加载的网页代码以产生网页代码对应内容的DOM树结构，然后，该函数可以通过对产生的DOM树结构遍历来获取其中具有快速访问属性的UI元素。可以以深度优先模式或广度优先模式对产生的DOM树结构进行遍历。下面将以深度优先模式为例进行介绍，本领域技术人员明白，广度优先模式类似，因而这里不再进行赘述。

假设加载的网页代码如下所示：

对于上述网页代码，该函数对其解析产生的DOM树结构如图4a所示。

然后，该函数可以利用JavaScript对象NodeIterator对整个DOM树结构遍历来进行深度优先模式的搜索，从根节点开始，依次到达根节点的子节点、子节点的子节点直到叶节点为止。仍以上述网页代码为例，利用对象NodeIterator对上述网页代码对应的DOM树结构遍历的顺序如图4b所示。可以利用对象document通过调用方法“createNodeIterator”创建对象NodeIterator，“createNodeIterator”方法可以具有四个参数，可以通过以下形式调用：

Document.createNodeIterator(root，whatToShow，filter；entityReferenceExpansion)

其中：

root：DOM树结构的根节点，也是进行深度优先模式搜索的起始点；

whatToShow：指示应该扫描何种节点；

filter：对象NodeFilter，指示应该忽略何种节点；

entityReferenceExpansion：指示是否应当扩展元素引用。

通过对上面描述的参数进行设置，可以实现获取网页中具有快速访问属性的UI元素。上面描述结合具体了应用实例，本领域技术人员知道，这些描述仅仅是示例性的，可以例如利用广度优先模式对产生DOM树结构进行遍历以获取网页中具有快速访问属性的UI元素，还可以通过现有技术中其他任何其他的方式实现获取网页中具有快速访问属性的UI元素的目的。

根据本发明的一个实施例，可以通过以下代码实现对上述网页代码对应的DOM树结构的遍历以获取其中具有快速访问属性的UI元素。

接下来，方法200进入步骤206，其中利用具有快速访问属性的UI元素产生快速访问面板。

根据本发明的一个实施例，首先，可以通过以下代码首先产生快速访问面板的框架。

接下来，在快速访问面板的框架内添加与获取的网页中具有快速访问属性的UI元素对应的UI元素。可以通过首先在快速访问面板的框架内创建UI元素，然后将UI元素与事件绑定或建立链接的方式来实现。例如，对于具有可映射的快速访问属性的按钮，可以通过以下代码实现在快速访问面板的框架内添加与获取的网页中具有快速访问属性的UI元素对应的UI元素的上述目的。

<button mappable＝”true”class＝”save_btn”onclick”doSave()；”>Save</button>

再例如，如果该按钮被多个按钮所参考，可以利用以下代码实现在快速访问面板的框架内添加与获取的网页中具有快速访问属性的UI元素对应的UI元素的上述目的。

例如，对于快速访问键或快速访问的特定键组合，可以通过在快速访问面板的框架内添加与之对应的快捷方式来实现。

同样，本领域技术人员知道，上面的描述仅仅是示例性的，可以例如现有技术中其他任何其他的方式实现利用具有快速访问属性的UI元素产生快速访问面板的目的。

根据本发明的一个实施例，其中产生的快速访问面板的透明度不低于预定的阈值。预定的阈值例如可以是50％，进一步地，预定的阈值可以例如根据所处环境的亮度进行动态的调整。可以通过设置产生的快速访问面板的层叠样式表的display属性的方式来实现上述目的。例如，为层叠样式表的display属性添加并设置透明度值参数，例如透明度值为100％或80％。这里，产生的快速访问面板的透明度不低于预定的阈值是为了尽量不影响用户的用户体验，例如，当透明度值为100％时，用户并不知道在加载网页代码同时产生了快速访问面板，用户在进行网页浏览时的体验不会改变。同时，由于在加载网页代码的同时产生了快速访问面板，为用户与移动设备的频繁交互做好了准备，因此能够达到提高用户与移动设备交互的效率。

进一步的，根据本发明的另一个实施例，用于在移动设备上显示网页的方法200进一步包括步骤208，其中判断是否检测到特定手势的输入。如果检测到特定手势的输入，方法200进入步骤210，其中在检测到特定手势输入的位置显示快速访问面板。可以利用现有技术来实现手势检测，并通过将检测到的手势与预定的特定手势相比较，如果匹配，则认为检测到了特定手势的输入并响应于该匹配在检测到特定手势输入的位置显示快速访问面板。可以以检测到特定手势输入的位置作为快速访问面板的中心位置显示快速访问面板。也可以以检测到特定手势输入的位置作为快速访问面板的起始或结束为止显示快速访问面板。接下来，方法200进入步骤212，其中将产生的快速访问面板的透明度设置为低于预定的阈值，预定的阈值例如可以是50％。可以通过设置产生的快速访问面板的层叠样式表的display属性的方式来实现上述目的。例如，为层叠样式表的display属性添加并设置透明度值参数，例如透明度值为0％或20％。这样，由于快速访问面板在用户输入特定手势的位置或其附近显示，因而对用户来说是最佳位置。因此，能够进一步提高用户与移动设备交互的效率。

进一步的，根据本发明的又一个实施例，用于在移动设备上显示网页的方法200进一步包括：响应于检测到特定事件，再次将快速访问面板的透明度设置为不低于预定的阈值。其中，特定事件为检测到第二特定手势的输入，或者是经过预定的时间。当然，还可以采用其他事件作为特定事件，这里不再一一赘述。通过采取上述方式，可以减少快速访问面板对用户浏览网页的用户体验的影响。

下面参见图3，其中显示了根据本发明一个实施例的用于在移动设备上显示网页的系统300的框图。根据本发明一个实施例的用于在移动设备上显示网页的系统300包括：

获取单元302，配置为获取网页中具有快速访问属性的用户界面元素；产生单元304，配置为利用具有快速访问属性的用户界面元素产生快速访问面板；其中，产生的快速访问面板的透明度不低于预定的阈值。

根据本发明的一个实施例，系统300进一步包括：显示单元306，配置为响应于检测到特定手势的输入，在检测到特定手势输入的位置显示快速访问面板。根据本发明的另一个实施例，系统300进一步包括：设置单元308，配置为将快速访问面板的透明度设置为低于预定的阈值。根据本发明的一个实施例，其中响应于检测到特定事件，设置单元配置为再次将快速访问面板的透明度设置为不低于预定的阈值，其中特定事件为检测到第二特定手势的输入，或者是经过预定的时间。当然，还可以采用其他事件作为特定事件，这里不再一一赘述。

附图中的流程图和框图显示了根据本发明的多个实施例的系统、方法和计算机程序产品的可能实现的体系架构、功能和操作。在这点上，流程图或框图中的每个方框可以代表一个模块、程序段或代码的一部分，所述模块、程序段或代码的一部分包含一个或多个用于实现规定的逻辑功能的可执行指令。也应当注意，在有些作为替换的实现中，方框中所标注的功能也可以以不同于附图中所标注的顺序发生。例如，两个连续的方框实际上可以基本并行地执行，它们有时也可以按相反的顺序执行，这依所涉及的功能而定。也要注意的是，框图和/或流程图中的每个方框、以及框图和/或流程图中的方框的组合，可以用执行规定的功能或操作的专用的基于硬件的系统来实现，或者可以用专用硬件与计算机指令的组合来实现。

以上已经描述了本发明的各实施例，上述说明是示例性的，并非穷尽性的，并且也不限于所披露的各实施例。在不偏离所说明的各实施例的范围和精神的情况下，对于本技术领域的普通技术人员来说许多修改和变更都是显而易见的。本文中所用术语的选择，旨在最好地解释各实施例的原理、实际应用或对市场中技术的技术改进，或者使本技术领域的其它普通技术人员能理解本文披露的各实施例。

Claims (12)

1.一种用于在移动设备上显示网页的方法，包括：

获取网页中具有快速访问属性的用户界面元素；

利用具有快速访问属性的用户界面元素产生快速访问面板；

其中，产生的快速访问面板的透明度不低于预定的阈值。

2.根据权利要求1的方法，进一步包括：

响应于检测到特定手势的输入，在检测到特定手势输入的位置显示快速访问面板。

3.根据权利要求2的方法，进一步包括：

将快速访问面板的透明度设置为低于预定的阈值。

4.根据权利要求3的方法，进一步包括：

响应于检测到特定事件，再次将快速访问面板的透明度设置为不低于预定的阈值。

5.根据权利要求4的方法，其中：

特定事件为检测到第二特定手势的输入。

6.根据权利要求4的方法，其中：

特定事件为经过预定的时间。

7.一种用于在移动设备上显示网页的系统，包括：

获取单元，配置为获取网页中具有快速访问属性的用户界面元素；

产生单元，配置为利用具有快速访问属性的用户界面元素产生快速访问面板；其中，产生的快速访问面板的透明度不低于预定的阈值。

8.根据权利要求7的系统，还包括：

显示单元，配置为响应于检测到特定手势的输入，在检测到特定手势输入的位置显示快速访问面板。

9.根据权利要求8的系统，进一步包括：

设置单元，配置为将快速访问面板的透明度设置为低于预定的阈值。

10.根据权利要求9的系统，其中：

响应于检测到特定事件，设置单元配置为再次将快速访问面板的透明度设置为不低于预定的阈值。

11.根据权利要求10的系统，其中：

特定事件为检测到第二特定手势的输入。

12.根据权利要求10的系统，其中：

特定事件为经过预定的时间。

Images