《一种基于网页元素与用户进行互动的方法与设备.pdf》由会员分享,可在线阅读,更多相关《一种基于网页元素与用户进行互动的方法与设备.pdf(17页珍藏版)》请在专利查询网上搜索。
1、(10)申请公布号 CN 102306174 A (43)申请公布日 2012.01.04 CN 102306174 A *CN102306174A* (21)申请号 201110246795.0 (22)申请日 2011.08.24 G06F 17/30(2006.01) G06F 19/00(2006.01) (71)申请人 百度在线网络技术 (北京) 有限公司 地址 100085 北京市海淀区上地十街 10 号 百度大厦 (72)发明人 邢皖甲 黄腾 (74)专利代理机构 北京汉昊知识产权代理事务 所 ( 普通合伙 ) 11370 代理人 罗朋 (54) 发明名称 一种基于网页元素与用户。
2、进行互动的方法与 设备 (57) 摘要 本发明的目的是提供一种基于任意网页中的 网页元素与用户进行互动的方法与设备。 其中, 互 动设备获取与浏览器的页面显示区域中显示的网 页相对应的浏览器内核中的块树, 其中所述块树 的各树节点中的块与所述网页的各网页元素相对 应 ; 根据所述块树, 获得用于与用户进行交互的 互动块 ; 根据与所述用户的交互, 更新所述互动 块的块属性, 以基于更新的块属性来将所述互动 块所对应的网页元素重新渲染到所述页面显示区 域中。与现有技术相比, 本发明具有以下优点 : 一 方面用户可基于任意已在浏览器中打开的网页进 行预定的互动, 从而提升用户体验 ; 另一方面通 。
3、过在各不同网页中分享通用的互动逻辑, 减少各 网页开发调试的工作量, 从而节约时间成本。 (51)Int.Cl. (19)中华人民共和国国家知识产权局 (12)发明专利申请 权利要求书 2 页 说明书 12 页 附图 2 页 CN 102306181 A1/2 页 2 1. 一种计算机实现的基于网页元素与用户进行互动的方法, 其中, 该方法包括以下步 骤 : a 获取与浏览器的页面显示区域中显示的网页相对应的浏览器内核中的块树, 其中所 述块树的各树节点中的块与所述网页的各网页元素相对应 ; b 根据所述块树, 获得用于与用户进行交互的互动块 ; c 根据与所述用户的交互, 更新所述互动块的块。
4、属性, 以基于更新的块属性来将所述互 动块所对应的网页元素重新渲染到所述页面显示区域中。 2. 根据权利要求 1 所述的方法, 其中, 所述步骤 b 还包括 : - 根据所述块树, 按照预定规则, 获得所述互动块。 3. 根据权利要求 2 所述的方法, 其中, 按照基于以下至少任一项的预定规则获得所述 互动块 : - 所述块所对应的网页元素在所述页面显示区域中的位置 ; - 所述块所对应的网页元素的类型 ; - 所述用户选择的网页元素。 4. 根据权利要求 1 所述的方法, 其中, 所述步骤 b 还包括 : - 在所述块树中生成新块, 并将其作为所述互动块。 5. 根据权利要求 1 至 4 中。
5、任一项所述的方法, 其中, 该方法还包括 : - 将所述互动块所对应的网页元素映射为预设网页游戏中的游戏对象 ; 其中, 所述步骤 c 还包括 : - 根据与所述用户的交互, 按照所述预设网页游戏的规则, 来更新与所述映射为游戏对 象的网页元素相对应的互动块的块属性, 以基于更新的块属性来将所述映射为该游戏对象 的网页元素重新渲染到所述页面显示区域中。 6. 根据权利要求 5 所述的方法, 其中, 所述步骤 b 还包括 : - 根据所述预设网页游戏, 在所述块树中生成新块, 并将其作为所述互动块。 7. 根据权利要求 1 至 6 中任一项所述的方法, 其中, 所述块属性包括以下至少任一项 : 。
6、- 所述块所对应的网页元素在所述页面显示区域中渲染的位置 ; - 所述块所对应的网页元素在所述页面显示区域中渲染的宽度与高度 ; - 所述块所对应的网页元素在所述页面显示区域中渲染的颜色 ; - 所述块所对应的网页元素在所述页面显示区域中渲染的旋转角度。 8. 根据权利要求 1 至 7 中任一项所述的方法, 其中, 所述网页包括以下至少任一项 : - 来自网络设备中的页面 ; - 来自所述浏览器的历史记录中的页面 ; - 浏览器的功能页面。 9. 一种基于网页元素与用户进行互动的设备, 其中, 该设备包括 : 块树获取装置, 用于获取与浏览器的页面显示区域中显示的网页相对应的浏览器内核 中的块。
7、树, 其中所述块树的各树节点中的块与所述网页的各网页元素相对应 ; 互动块获取装置, 用于根据所述块树, 获得用于与用户进行交互的互动块 ; 渲染装置, 用于根据与所述用户的交互, 更新所述互动块的块属性, 以基于更新的块属 性来将所述互动块所对应的网页元素重新渲染到所述页面显示区域中。 权 利 要 求 书 CN 102306174 A CN 102306181 A2/2 页 3 10. 根据权利要求 9 所述的设备, 其中, 所述互动块获取装置还用于根据所述块树, 按 照预定规则, 获得所述互动块。 11. 根据权利要求 10 所述的设备, 其中, 所述互动块获取装置按照基于以下至少任一 项。
8、的预定规则获得所述互动块 : - 所述块所对应的网页元素在所述页面显示区域中的位置 ; - 所述块所对应的网页元素的类型 ; - 所述用户选择的网页元素。 12. 根据权利要求 9 所述的设备, 其中, 所述互动块获取装置还用于在所述块树中生成 新块, 并将其作为所述互动块。 13. 根据权利要求 9 至 12 中任一项所述的设备, 其中, 该设备还包括 : 映射装置, 用于将所述互动块所对应的网页元素映射为预设网页游戏中的游戏对象 ; 其中, 所述渲染装置还用于根据与所述用户的交互, 按照所述预设网页游戏的规则, 来 更新与所述映射为游戏对象的网页元素相对应的互动块的块属性, 以基于更新的块。
9、属性来 将所述映射为该游戏对象的网页元素重新渲染到所述页面显示区域中。 14. 根据权利要求 13 所述的设备, 其中, 所述互动块获取装置还用于根据所述预设网 页游戏, 在所述块树中生成新块, 并将其作为所述互动块。 15. 根据权利要求 9 至 14 中任一项所述的设备, 其中, 所述块属性包括以下至少任一 项 : - 所述块所对应的网页元素在所述页面显示区域中渲染的位置 ; - 所述块所对应的网页元素在所述页面显示区域中渲染的宽度与高度 ; - 所述块所对应的网页元素在所述页面显示区域中渲染的颜色 ; - 所述块所对应的网页元素在所述页面显示区域中渲染的旋转角度。 16. 根据权利要求 。
10、9 至 15 中任一项所述的设备, 其中, 所述网页包括以下至少任一项 : - 来自网络设备中的页面 ; - 来自所述浏览器的历史记录中的页面 ; - 浏览器的功能页面。 权 利 要 求 书 CN 102306174 A CN 102306181 A1/12 页 4 一种基于网页元素与用户进行互动的方法与设备 技术领域 0001 本发明涉及互联网技术领域, 尤其涉及一种基于网页元素与用户进行互动的方法 与设备。 背景技术 0002 随着互联网技术的广泛的应用, 网页游戏因其无需下载客户端, 而仅需进入特定 的网页即可开始游戏而受到欢迎。目前, 网页游戏主要基于内嵌在网页中的 flash, 并且。
11、游 戏仅在该 flash 的显示区域内进行, 而不能在整个网页中进行。然而上述实现方式存在如 下缺点 : 首先, 游戏必须基于特定的网页才可进行, 例如, 用户需在浏览器中输入该网页游 戏所对应的 URL( 统一资源定位符 ) 以打开该游戏的网页并进行游戏, 然而, 若该网页的服 务器暂时无法访问, 则用户无法进行游戏, 从而影响用户体验 ; 其次, 各网页游戏中存在一 些通用的实现逻辑, 如游戏角色的确定、 游戏角色在网页中的移动等, 若在每个网页游戏中 分别实现该些逻辑, 将增加网页修改与调试的工作量, 更近一步地, 除网页游戏外, 还存在 其他通用的用于与用户进行互动的互动逻辑分别在不同。
12、的网页中各自实现, 例如, 诸如注 册账号网页、 发布评论网页中都存在的校验码输入逻辑, 以用于确认当前操作为人工操作 而非机器操作, 虽然这些校验逻辑的实现几乎相同 ; 再如, 存在不同网页分别实现针对其中 某些网页元素的动画逻辑, 虽然这些动画逻辑也是相同的, 这些都将导致较高的网页开发 与维护成本。 0003 因此, 如何基于任意网页中的网页元素与用户进行互动成为亟需解决的问题。 发明内容 0004 本发明的目的是提供一种基于任意网页中的网页元素与用户进行互动的方法与 设备。 0005 根据本发明的一个方面, 提供一种计算机实现的基于任意网页中的网页元素与用 户进行互动的方法, 其中, 。
13、该方法包括以下步骤 : 0006 a 获取与浏览器的页面显示区域中显示的网页相对应的浏览器内核中的块树, 其 中所述块树的各树节点中的块与所述网页的各网页元素相对应 ; 0007 b 根据所述块树, 获得用于与用户进行交互的互动块 ; 0008 c 根据与所述用户的交互, 更新所述互动块的块属性, 以基于更新的块属性来将所 述互动块所对应的网页元素重新渲染到所述页面显示区域中。 0009 根据本发明的一个方面, 提供一种基于任意网页中的网页元素与用户进行互动的 设备, 其中, 该设备包括 : 0010 块树获取装置, 用于获取与浏览器的页面显示区域中显示的网页相对应的浏览器 内核中的块树, 其。
14、中所述块树的各树节点中的块与所述网页的各网页元素相对应 ; 0011 互动块获取装置, 用于根据所述块树, 获得用于与用户进行交互的互动块 ; 0012 渲染装置, 用于根据与所述用户的交互, 更新所述互动块的块属性, 以基于更新的 说 明 书 CN 102306174 A CN 102306181 A2/12 页 5 块属性来将所述互动块所对应的网页元素重新渲染到所述页面显示区域中。 0013 与现有技术相比, 本发明具有以下优点 : 一方面, 用户可基于任意已在浏览器中打 开的网页即可进行预定的互动 ( 如游戏等 ), 而无需访问互联网服务器中特定的互动网页, 从而提升用户体验 ; 一方面。
15、, 通过在各不同网页中分享通用的互动逻辑 ( 如身份验证逻辑, 动画逻辑等 ), 减少各网页开发调试的工作量, 从而节约时间成本, 同时, 由于该互动逻辑通 过直接操作浏览器内核数据实现, 其相较于基于诸如 Javascript 脚本实现的互动逻辑具 有更高的执行效率, 这对于在处理性能尚有欠缺的用户设备 ( 如智能手机, PDA 等 ) 中进行 网页互动具有现实意义 ; 另一方面, 本发明无需网页中预置动画逻辑, 即可实现基于网页中 任意网页元素的动画效果, 从而提高网页浏览的趣味性, 提升用户体验。 附图说明 0014 通过阅读参照以下附图所作的对非限制性实施例所作的详细描述, 本发明的其。
16、它 特征、 目的和优点将会变得更明显 : 0015 图 1 示出浏览器内核的工作原理图 ; 0016 图 2 示出根据本发明一个方面基于网页元素与用户进行互动的设备示意图 ; 0017 图 3 示出根据本发明另一个方面基于网页元素与用户进行互动的方法流程图 ; 0018 附图中相同或相似的附图标记代表相同或相似的部件。 具体实施方式 0019 下面结合附图对本发明作进一步详细描述。 0020 浏览器内核包括浏览器的页面渲染引擎, 其将网页内容渲染到浏览器的页面显示 区域中。现有主流浏览器内核包括 IE 浏览器使用的 Trident 内核、 Firefox 浏览器使用的 Gecko 内核、 Sa。
17、fari 浏览器使用的 webkit 内核及 Opera 浏览器使用的 Presto 内核等。它 们工作原理大体相同, 现参照图 1, 以 Webkit 内核为例介绍浏览器内核的工作原理。首先, 浏览器内核获取待渲染的网页所对应的HTML或XHTML文本, 并将该文本解析成为一棵文档 对象模型 (DOM) 树, 该树的各个节点分别对应该 HTML 文本中的标签或标签中的内容, 即该 网页中的网页元素 ; 接着, 浏览器内核根据该 DOM 树, 创建与该 DOM 树相对应的用于渲染该 网页的块树 ( 或称渲染树 ), 该块树的各节点中的 “矩形块” ( 以下简称块 ) 代表页面显示 区域中的各渲。
18、染子区域, 该渲染子区域用于显示与该块相对应的网页元素, 各块的块属性 至少包含该渲染子区域在页面显示区域中的位置坐标及宽高等属性信息, 换言之, 该页面 显示区域被各块所划分, 各块所代表的渲染子区域中显示该块对应的网页元素 ; 随后, 浏览 器内核通过遍历该块树中各节点的块, 以将该网页中的所有网页元素渲染到浏览器的页面 显示区域中。 在此, 所述网页元素包括但不限于网页中的纯文本文字, 超文本链接, 图片, 表 格、 表单控件 ( 如按钮、 文本输入域、 下拉列表、 单选框、 复选框等 ) 等。 0021 图 2 示出根据本发明一个方面基于网页元素与用户进行互动的设备示意图。互动 设备 。
19、1 包括块树获取装置 11、 互动块获取装置 12 和渲染装置 13。在此, 互动设备 1 包括, 但不限于, 计算机、 智能手机、 PDA 等任何具有上网浏览功能的设备。 0022 具体地, 块树获取装置 11 获取与浏览器的页面显示区域中显示的网页相对应的 浏览器内核中的块树, 其中所述块树的各树节点中的块与所述网页的各网页元素相对应。 说 明 书 CN 102306174 A CN 102306181 A3/12 页 6 更具体地, 块树获取装置 11 例如通过约定的通信接口从浏览器内核中读取与当前在浏览 器页面显示区域中显示的网页相对应的块树, 或者通过第三方设备获得该块树。 在此, 。
20、所述 约定通信接口包括但不限于浏览器内核提供的应用编程接口 (API) 等。在此, 所述网页包 括但不限于来自网络设备中的页面、 来自所述浏览器的历史记录中的页面以及浏览器自带 的功能页面等。 在此, 所述浏览器包括但不限于Microsoft公司的IE浏览器、 Mozilla公司 的 Firefox 浏览器、 Google 公司的 Chrome 浏览器、 苹果公司的 Safari 浏览器、 遨游公司的 Maxthon 浏览器、 Opera 公司的 opera 浏览器、 360 公司的 360 浏览器、 搜狐公司的搜狗浏览 器、 腾讯公司的腾讯TT浏览器等。 在此, 所述浏览器内核包括但不限于T。
21、rident内核、 Gecko 内核、 webkit 内核、 Presto 内核等。例如, 当浏览器为苹果公司的 Safari 浏览器, 其使用 的浏览器内核为 webkit, 用户在该浏览器的地址栏中输入某网页的 URL, 浏览器根据该 URL 从本地或网络获取该 URL 所对应的网页, 浏览器内核解析该网页的 HTML 文本, 并创建相应 的块树, 随后, 块树获取装置 11 通过调用该浏览器内核提供的 API 读取其中的块树。再如, 块树获取装置 11 向第三方设备发送获取与浏览器的页面显示区域中显示的网页相对应的 块树的请求, 并接收该第三方设备基于该请求返回的块树。本领域技术人员应能。
22、理解上述 获取块树的方式仅为举例, 其他现有的或今后可能出现的获取块树的方式如可适用于本发 明, 也应包含在本发明保护范围以内, 并在此以引用方式包含于此。 0023 随后, 互动块获取装置 12 根据所述块树, 获得用于与用户进行交互的互动块。具 体地, 互动块获取装置 12 根据块树获取装置 11 提供的块树获取用于与用户进行交互的互 动块, 其中, 互动块获取装置 12 获取所述互动块的方式包括但不限于 : 1) 按照预定规则, 从 该块树的各节点中选择若干块作为将与用户进行交互的互动块 ; 2) 创建新块, 将该 ( 些 ) 新块添加到该块树中, 并将该 ( 些 ) 新块作为所述互动块。
23、, 其中, 创建新块包括设置该块的 块属性 ( 如其在页面显示区域中的位置、 宽高 )、 设置与该新块对应的新的网页元素等。例 如, 当预定规则为将显示在页面显示区域左上角和右下角的网页元素所对应的块作为互动 块, 则互动块获取装置 12 遍历该块树, 并从各节点中的块的块属性中获得各块在页面显示 区域中的位置坐标, 并据此获得相应的互动块。再如, 互动块获取装置 12 创建一个新块, 设 置该块在页面显示区域的坐标为 (0, 0), 其宽高属性为 10*10 像素, 并将一个图片作为与该 新块相对应的网页元素, 随后, 互动块获取装置 12 通过在该块树中添加新的节点以包含新 块, 并将该新。
24、块作为互动块。接上例, 优选地, 互动块获取装置 12 随后还可触发浏览器内核 重新遍历该块树, 以将该新块所对应的新网页元素渲染到页面显示区域中。本领域技术人 员应能理解上述获取互动块的方式仅为举例, 其他现有的或今后可能出现的获取互动块的 方式如可适用于本发明, 也应包含在本发明保护范围以内, 并在此以引用方式包含于此。 0024 接着, 渲染装置 13 根据与所述用户的交互, 更新所述互动块的块属性, 以基于更 新的块属性来将所述互动块所对应的网页元素重新渲染到所述页面显示区域中。具体地, 渲染装置 13 例如监听用户与浏览器的页面显示区域中显示的与该互动块所对应的网页元 素的交互消息事。
25、件, 并按照预设的互动应用的规则, 基于该交互消息事件更新相应的互动 块的块属性, 然后, 渲染装置 13 触发浏览器内核基于该更新的块属性将该块所对应的网页 元素重新渲染到该页面显示区域中。 例如, 当互动应用为某网页元素的动画效果展示, 该互 动应用的规则为当用户将光标移动到互动块所对应的网页元素之上时, 对该网页元素进行 放大展示, 当光标离开该网页元素时, 该网页元素恢复至原始大小, 互动块获取装置 12 获 说 明 书 CN 102306174 A CN 102306181 A4/12 页 7 取的互动块的宽高属性为 10*10 像素, 与该互动块相对应的网页元素为一张图片, 当用户。
26、 将光标移动至该图片之上时, 渲染装置 13 根据监听到该用户交互消息事件, 修改该互动块 的宽高属性至 20*20 像素, 并触发浏览器内核基于该更新的宽高属性在该互动块代表的渲 染子区域内按比例重新渲染该图片, 以实现该图片的放大显示, 同理, 当用户将光标移出该 图片时, 渲染装置 13 将该互动块的宽高属性恢复至 10*10 像素, 并触发浏览器内核重新渲 染该图片, 以实现该图片的缩放动画效果。再如, 当互动应用为页面操作的验证应用, 即验 证当前的网页操作为人工操作抑或机器操作, 该互动应用的规则为用户按照互动应用的要 求将互动块所对应的网页元素显示在指定的位置, 互动块获取装置 。
27、12 获取的互动块的宽 高属性为 10*10 像素, 与该互动块相对应的网页元素为一段纯文本, 该互动应用以弹出对 话框或语音播放的形式提示用户首先选中该段纯文本, 然后在页面显示区域的指定目标位 置的进行鼠标单击以使该段纯文本的显示位置改变到进行鼠标单击的目标位置, 用户根据 该提示信息进行相应的用户操作, 渲染装置 13 根据监听到的该用户的交互消息事件, 将该 互动块的位置坐标修改为该指定目标位置的坐标, 并触发浏览器内核基于该更新的属性在 该互动块代表的新的渲染子区域内渲染该段纯文本, 以验证当前的网页操作为人工操作。 本领域技术人员应能理解上述用户交互的方式和更新互动块的方式仅为举例。
28、, 其他现有的 或今后可能出现的用户交互的方式或更新互动块的方式如可适用于本发明, 也应包含在本 发明保护范围以内, 并在此以引用方式包含于此。 0025 在此, 所述块树的节点中的块的块属性可包括但不限于以下至少任一项 : 0026 - 所述块所对应的网页元素在所述页面显示区域中渲染的位置 ; 0027 - 所述块所对应的网页元素在所述页面显示区域中渲染的宽度与高度 ; 0028 - 所述块所对应的网页元素在所述页面显示区域中渲染的颜色 ; 0029 - 所述块所对应的网页元素在所述页面显示区域中渲染的旋转角度。 0030 具体地, 所述块属性包括所述块所对应的网页元素在所述页面显示区域中渲。
29、染的 位置, 即该块的坐标位置。例如, 渲染装置 13 可根据该块坐标位置的更新, 重新对该块对应 的网页元素进行渲染, 以使其显示在更新后的坐标位置。所述块属性包括所述块所对应的 网页元素在所述页面显示区域中渲染的宽度与高度, 即该块的宽高。例如, 渲染装置 13 可 根据该块宽高属性的更新, 重新对该块对应的网页元素进行渲染, 以实现该网页元素的缩 放效果。所述块属性包括所述块所对应的网页元素在所述页面显示区域中渲染的颜色。例 如, 当该网页元素为一段文字, 渲染装置 13 可根据颜色块属性的更新, 按照更新后的颜色 渲染该段文字。 所述块属性包括所述块所对应的网页元素在所述页面显示区域中。
30、渲染的旋 转角度。例如, 渲染装置 13 可根据旋转角度块属性的更新, 按照更新后的旋转角度进行渲 染, 以实现网页元素的旋转显示。本领域技术人员应能理解, 上述各项块属性不仅可以单 独用于渲染装置 13 对该块所对应的网页元素进行渲染, 还可以将其中多项结合用于渲染 装置 13 对该块所对应的网页元素进行渲染。本领域技术人员应能理解上述块属性仅为举 例, 其他现有的或今后可能出现的块属性如可适用于本发明, 也应包含在本发明保护范围 以内, 并在此以引用方式包含于此。 0031 在此, 所述网页可包括但不限于以下至少任一项 : 0032 - 来自网络设备中的页面 ; 0033 - 来自所述浏览。
31、器的历史记录中的页面 ; 说 明 书 CN 102306174 A CN 102306181 A5/12 页 8 0034 - 浏览器的功能页面。 0035 具体地, 所述网页包括来自网络设备中的页面, 其中, 所述网络设备包括但不限于 计算机、 网络主机、 单个网络服务器、 多个网络服务器集或多个服务器构成的云。 在此, 云由 基于云计算(Cloud Computing)的大量计算机或网络服务器构成, 其中, 云计算是分布式计 算的一种, 由一群松散耦合的计算机集组成的一个超级虚拟计算机。 例如, 浏览器可通过诸 如 http、 https 等网络协议从该网络设备获取网页。所述网页包括来自所。
32、述浏览器的历史 记录中的页面。例如, 浏览器直接访问缓存在本地的历史浏览过的网页。所述网页包括浏 览器的功能页面, 其中, 所述功能页面包括但不限于浏览器自带的导航页面、 搜索页面、 空 白页面等。本领域技术人员应能理解上述网页仅为举例, 其他现有的或今后可能出现的网 页如可适用于本发明, 也应包含在本发明保护范围以内, 并在此以引用方式包含于此。 0036 优选地, 块树获取装置11、 互动块获取装置12和渲染装置13之间是持续不断地工 作。具体地, 块树获取装置 11 获取与浏览器的页面显示区域中显示的网页相对应的浏览器 内核中的块树, 其中所述块树的各树节点中的块与所述网页的各网页元素相。
33、对应 ; 随后, 互 动块获取装置 12 根据所述块树, 获得用于与用户进行交互的互动块 ; 接着, 渲染装置 13 根 据与所述用户的交互, 更新所述互动块的块属性, 以基于更新的块属性来将所述互动块所 对应的网页元素重新渲染到所述页面显示区域中 ; 在此, 本领域技术人员应理解 “持续” 是 指各装置分别按照设定的或实时调整的工作模式要求进行块树的获取、 互动块的获取、 及 互动块所对应的网页元素的重新渲染展示, 直至块树获取装置 11 在较长时间内停止对用 户选择的搜索结果的获取。 0037 优选地, 互动块获取装置 12 还可根据所述块树, 按照预定规则, 获得所述互动块。 具体地, 。
34、互动块获取装置 12 还可根据块树获取装置 11 提供的块树, 按照预定规则, 获得用 于与用户进行交互的互动块, 在此, 所述预定规则包括但不限于将其所对应的网页元素为 图片的所有块作为所述互动块、 根据与用户交互, 将与该用户所选定的网页元素相对应的 块作为所述互动块等。例如, 互动块获取装置 12 通过遍历块树中的所有节点, 获取各节点 的块所对应的网页元素, 据此获得其所对应的网页元素为图片的块, 并将该(些)块作为用 于与用户进行交互的互动块。本领域技术人员应能理解上述获取互动块的方式仅为举例, 其他现有的或今后可能出现的获取互动块的方式如可适用于本发明, 也应包含在本发明保 护范围。
35、以内, 并在此以引用方式包含于此。 0038 优选地, 所述互动块获取装置 12 按照基于以下至少任一项的预定规则获得所述 互动块 : 0039 - 所述块所对应的网页元素在所述页面显示区域中的位置 ; 0040 - 所述块所对应的网页元素的类型 ; 0041 - 所述用户选择的网页元素。 0042 具体地, 当所述预定规则为基于所述块所对应的网页元素在所述页面显示区域中 的位置获得所述块时, 则互动块获取装置 12 根据该块所对应的网页元素在所述页面显示 区域的特定位置, 如左上角或右下角, 来获取与用户进行交互的互动块 ; 当所述预定规则为 基于所述块所对应的网页元素的类型获得所述块时, 。
36、其中, 网页元素的类型包括但不限于 文字、 图片、 表单控件等, 则互动块获取装置 12 获取特定类型的网页元素所对应的块作为 互动块 ; 当所述预定规则基于所述用户选择的网页元素, 则互动块获取装置 12 获取用户选 说 明 书 CN 102306174 A CN 102306181 A6/12 页 9 择的网页元素所对应的块作为互动块, 例如, 用户通过与浏览器显示区域进行用户交互来 选中某 ( 些 ) 网页元素, 互动块获取装置 12 通过监听用户的交互消息事件, 获取该用户所 选中的网页元素, 据此从块树中获得与该网页元素相对应的块, 并将该(些)块作为用于与 用户进行交互的互动块。本。
37、领域技术人员应能理解, 上述各项预定规则不仅可以单独用于 互动块获取装置 12 获取互动块, 还可以将其中多项结合用于互动块获取装置 12 获取互动 块。本领域技术人员应能理解上述预定规则仅为举例, 其他现有的或今后可能出现的预定 规则如可适用于本发明, 也应包含在本发明保护范围以内, 并在此以引用方式包含于此。 0043 优选地, 互动块获取装置 12 还可在所述块树中生成新块, 并将其作为所述互动 块。具体地, 互动块获取装置 12 还可根据预定的互动应用或用户请求在所述块树中生成新 块, 并将其作为互动块。 例如, 当互动应用为一只乌鸦从页面显示区域的左上角飞向该页面 显示区域的右上角的。
38、动画效果, 则互动块获取装置 12 首先创建一个新块, 设置该块的块属 性中的位置坐标为 (0, 0), 将乌鸦图片作为该新块的所对应的网页元素, 并将该乌鸦图片的 尺寸大小赋予该块的宽高属性。优选地, 接上例, 互动块获取装置 12 随后还可触发浏览器 内核重新遍历该块树, 以将该新块所对应的乌鸦图片渲染到页面显示区域中。本领域技术 人员应能理解上述获取互动块的方式仅为举例, 其他现有的或今后可能出现的获取互动块 的方式如可适用于本发明, 也应包含在本发明保护范围以内, 并在此以引用方式包含于此。 0044 在一个优选实施例中 ( 参照图 1), 互动设备 1 还包括映射装置 ( 未示出 )。
39、。以下 参照图 1 对该优选实施例进行详细描述, 其中, 块树获取装置 11 获取与浏览器的页面显示 区域中显示的网页相对应的浏览器内核中的块树, 其中所述块树的各树节点中的块与所述 网页的各网页元素相对应 ; 随后, 互动块获取装置 12 根据所述块树, 获得用于与用户进行 交互的互动块 ; 接着, 渲染装置 13 根据与所述用户的交互, 更新所述互动块的块属性, 以基 于更新的块属性来将所述互动块所对应的网页元素重新渲染到所述页面显示区域中 ; 其具 体过程与前述参照图1所描述的实施例中块树获取装置11、 互动块获取装置12和渲染装置 13 所执行的过程相同, 为简明起见, 以引用方式包含。
40、于此, 而不做赘述。 0045 具体地, 所述映射装置将所述互动块所对应的网页元素映射为预设网页游戏中的 游戏对象 ; 接着, 所述渲染装置 13 根据与所述用户的交互, 按照所述预设网页游戏的规则, 来更新与所述映射为游戏对象的网页元素相对应的互动块的块属性, 以基于更新的块属性 来将所述映射为该游戏对象的网页元素重新渲染到所述页面显示区域中。更具体地, 所述 映射装置将互动块获取装置 12 获得的互动块所对应的网页元素映射为预设网页游戏中的 游戏对象, 其中, 所述预设的网页游戏可存储在互动设备 1 中, 或可存储在浏览器内核中 ; 接着, 用户在该网页的页面显示区域操作该游戏对象, 渲染。
41、装置 13 监听该用户的游戏对象 操作消息事件, 按照该网页游戏的规则, 来更新与该映射为游戏对象的网页元素相对应的 互动块的块属性, 以基于更新的块属性来将该映射为该游戏对象的网页元素重新渲染到所 述页面显示区域中, 以此实现该用户进行该网页游戏。例如, 当网页游戏为王子救公主, 映 射装置将互动块 A 所对应的网页元素映射为王子, 而将互动块 B 所对应网页元素映射为公 主, 优选地, 映射装置还可将互动块 A 所对应的网页元素更新为王子的图片, 而将互动块 B 所对应网页元素更新为公主的图片 ; 接着, 用户在页面显示区域中选中王子, 然后在公主的 位置进行鼠标单击, 以指示王子向公主的。
42、位置移动, 渲染装置 13 接收到该用户的游戏对象 操作消息事件, 沿着互动块 A 的块属性中的位置坐标与互动块 B 的块属性中的位置坐标的 说 明 书 CN 102306174 A CN 102306181 A7/12 页 10 直线连接的方向上, 更新互动块 A 的块属性中位置坐标, 并触发浏览器内核重新渲染王子 的图片以改变其显示位置, 由此, 渲染装置 13 通过连续地更新互动块 A 的块属性中的的位 置坐标, 并以此重新渲染王子的图片的显示位置, 从而在页面显示区域中实现王子向公主 移动的游戏操作效果。本领域技术人员应能理解上述映射游戏对象的方式仅为举例, 其他 现有的或今后可能出现。
43、的映射游戏对象的方式如可适用于本发明, 也应包含在本发明保护 范围以内, 并在此以引用方式包含于此。 0046 优选地, 所述互动块获取装置 12 还可根据所述预设网页游戏, 在所述块树中生成 新块, 并将其作为所述互动块。具体地, 互动块获取装置 12 例如还可根据预设的诸如王子 救公主的网页游戏中具有的游戏角色, 在块树中生成新块, 该新块的块属性中的位置坐标 为游戏角色的初始位置, 该新块的块属性中的宽高为该游戏角色的大小, 该新块所对应的 新增网页元素为该游戏角色的图像, 并将该新块作为与用户进行交互的互动块。本领域技 术人员应能理解上述获得互动块的方式仅为举例, 其他现有的或今后可能。
44、出现的获得互动 块的方式如可适用于本发明, 也应包含在本发明保护范围以内, 并在此以引用方式包含于 此。 0047 此外, 上述互动设备 1 可以与现有的浏览器相结合, 构成一种新的浏览器, 还可 以作为浏览器插件, 与现有的浏览器相结合, 现有的浏览器可以是例如 Microsoft 公司的 IE 浏览器、 Mozilla 公司的 Firefox 浏览器、 Google 公司的 Chrome 浏览器、 遨游公司的 Maxthon 浏览器、 Opera 公司的 opera 浏览器、 360 公司的 360 浏览器、 搜狐公司的搜狗浏览 器、 腾讯公司的腾讯 TT 浏览器等。 0048 图 3 示。
45、出根据本发明一个方面基于网页元素与用户进行互动的方法流程图。在 此, 互动设备 1 包括, 但不限于, 计算机、 智能手机、 PDA 等任何具有上网浏览功能的设备。 0049 具体地, 在步骤 S1 中, 互动设备 1 获取与浏览器的页面显示区域中显示的网页相 对应的浏览器内核中的块树, 其中所述块树的各树节点中的块与所述网页的各网页元素相 对应。更具体地, 在步骤 S1 中, 互动设备 1 例如通过约定的通信接口从浏览器内核中读取 与当前在浏览器页面显示区域中显示的网页相对应的块树, 或者通过第三方设备获得该块 树。在此, 所述约定通信接口包括但不限于浏览器内核提供的应用编程接口 (API)。
46、 等。在 此, 所述网页包括但不限于来自网络设备中的页面、 来自所述浏览器的历史记录中的页面 以及浏览器自带的功能页面等。在此, 所述浏览器包括但不限于 Microsoft 公司的 IE 浏 览器、 Mozilla 公司的 Firefox 浏览器、 Google 公司的 Chrome 浏览器、 苹果公司的 Safari 浏览器、 遨游公司的 Maxthon 浏览器、 Opera 公司的 opera 浏览器、 360 公司的 360 浏览器、 搜狐公司的搜狗浏览器、 腾讯公司的腾讯 TT 浏览器等。在此, 所述浏览器内核包括但不限 于 Trident 内核、 Gecko 内核、 webkit 内。
47、核、 Presto 内核等。例如, 当浏览器为苹果公司的 Safari 浏览器, 其使用的浏览器内核为 webkit, 用户在该浏览器的地址栏中输入某网页的 URL, 浏览器根据该 URL 从本地或网络获取该 URL 所对应的网页, 浏览器内核解析该网页的 HTML 文本, 并创建相应的块树, 随后, 在步骤 S1 中, 互动设备 1 通过调用该浏览器内核提供 的 API 读取其中的块树。再如, 在步骤 S1 中, 互动设备 1 向第三方设备发送获取与浏览器 的页面显示区域中显示的网页相对应的块树的请求, 并接收该第三方设备基于该请求返回 的块树。本领域技术人员应能理解上述获取块树的方式仅为举。
48、例, 其他现有的或今后可能 出现的获取块树的方式如可适用于本发明, 也应包含在本发明保护范围以内, 并在此以引 说 明 书 CN 102306174 A CN 102306181 A8/12 页 11 用方式包含于此。 0050 随后, 在步骤 S2 中, 互动设备 1 根据所述块树, 获得用于与用户进行交互的互动 块。 具体地, 在步骤S2中, 互动设备1根据其在步骤S1中获得的块树, 获取用于与用户进行 交互的互动块, 其中, 在步骤 S2 中, 互动设备 1 获取所述互动块的方式包括但不限于 : 1) 按 照预定规则, 从该块树的各节点中选择若干块作为将与用户进行交互的互动块 ; 2) 。
49、创建新 块, 将该 ( 些 ) 新块添加到该块树中, 并将该 ( 些 ) 新块作为所述互动块, 其中, 创建新块包 括设置该块的块属性 ( 如其在页面显示区域中的位置、 宽高 )、 设置与该新块对应的新的网 页元素等。例如, 当预定规则为将显示在页面显示区域左上角和右下角的网页元素所对应 的块作为互动块, 则在步骤S2中, 互动设备1遍历该块树, 并从各节点中的块的块属性中获 得各块在页面显示区域中的位置坐标, 并据此获得相应的互动块。再如, 在步骤 S2 中, 互动 设备1创建一个新块, 设置该块在页面显示区域的坐标为(0, 0), 其宽高属性为10*10像素, 并将一个图片作为与该新块相对应的网页元素, 随后, 在步骤S2中, 互动设备1通过在该块 树中添加新的节点以包含新块, 并将该新块作为互动块。接上例, 优选地, 在步骤 S2 中, 互 动设备 1 随后还可触发浏览器内核重新遍历该块树, 以将该新块所对应的新网页元素渲染 到页面显示区域中。本领域技术人员应能理解上述获取互动块的方式仅为举例, 其他现有 的或今后可能出现的获取互动块的方式如可适用于本发明, 也应包含在本发明保护。