用于提供多个视图的浏览器级背景页面的制作方法
【专利说明】
[0001] 相关申请案的夺叉参考
[0002] 本申请案主张2012年8月9日申请的标题为"用于提供多视图的浏览器级背景页 面（BROWSER-LEVEL BACKGROUND PAGE FOR PROVIDING MULTIPLE VIEWS) "的第 13/570, 962 号美国非临时专利申请案的优先权且为其接续案，所述申请案的揭示内容的全文以引用方 式并入本文中。
技术领域
[0003] 本说明书通常涉及一种模型-视图-控制器框架。
【背景技术】
[0004] 通常，网络应用程序现尝试遵循用户接口的模型-视图-控制器（MVC)设计模式。 MVC设计模式将应用程序划分成三个责任区域：(a)模型：表示应用程序状态的域对象或数 据结构；(b)视图，其观察状态并为用户生成输出；及（c)控制器，其将用户输入翻译成操作 模型。网络应用程序常常遇到的一个问题为表示网络应用程序的文档对象模型（DOM)树是 统一的且不提供任何封装抽象化。这导致难以维持基元数据类型（例如，模型及视图）的 逻辑分离。
[0005] 对MVC设计模式的一种变通方案为由用户接口开发人员提供替代操作手段。然 而，这个变通方案导致大量用户接口专用API。因此，需要一种用以解决本发明技术的缺点 且提供其它新颖及创新特征的系统及方法。
【发明内容】
[0006] 根据一个一般方面，一种用于实施网络应用程序的方法可包含使用计算装置的处 理器，将网络应用程序的网页的一个元素投影到所述网页的视图中，所述视图为所述网页 的模型的视觉表示，所述模型包含应用程序数据及规则。控制器可调解输入并将输入转换 成针对所述视图或所述模型的命令。所述控制器可使用表示影子文档对象模型子树中界定 的位置的插入点调换投影在所述网页的所述视图中的所述一个元素与另一元素，而不影响 所述网页的文档对象模型树。
[0007] 根据另一一般方面，一种系统可包含存储器；及处理器，所述处理器可操作地耦合 到所述存储器且经配置以执行代码以：提供包含模型列表的HTML文档，其中所述列表中的 每一模型为所述HTML文档的主体的子代；在所述HTML文档的所述主体中创建影子文档对 象模型子树，所述影子文档对象模型子树包含一或多个插入点；及使用所述一或多个插入 点的匹配准则，指定在网页的视图中显示所述模型列表中的哪个模型。
[0008] 根据又一一般方面，一种非暂时性计算机可读媒体可含有导致计算装置进行如下 操作的可执行代码：使用所述计算装置的处理器，将网页的一个元素投影到所述网页的视 图中；及使用所述处理器，使用表示影子文档对象模型子树中界定的位置的插入点调换投 影在所述网页的所述视图中的所述一个元素与另一元素，而不通知浏览器级背景页面。所 述浏览器级背景页面可为缺乏其自身用户接口且充当网络应用程序的所有视图的容器的 脚本文件，包含所述网页的所述视图。由所述网络应用程序所创建的每一窗口可展示所述 浏览器级背景页面的不同视图。
[0009] 在附图及下文描述中阐述一或多个实施方案的细节。从【具体实施方式】、【附图说明】 及权利要求书，其它特征将显而易见。
【附图说明】
[0010] 图1为网络应用程序框架的实例框图。
[0011] 图2为影子文档对象模型框架的实例框图。
[0012] 图3为另一影子文档对象模型框架的实例框图。
[0013] 图4A为根据此处所描述技术的网络应用程序的用户接口的实例。
[0014] 图4B为根据此处所描述技术的网络应用程序的另一用户接口的实例。
[0015] 图5A、5B及5C包含图4A及4B的网络应用程序的代码的实例。
[0016] 图6为说明图1至5的系统的实例操作的流程图。
[0017] 图7为展示可用于实施根据图1至6的系统及方法的实例或代表性计算装置及相 关元件的框图。
[0018] 各个图式中的相似参考符号指示相似元件。
【具体实施方式】
[0019] 文档对象模型（DOM)为表示HTML、XHTML及XML文档中的对象及与所述对象交互 的跨平台且独立于语言的规约。如本文中所使用，"文档"是指DOM的原始文档。"节点"是 指参与树的任何DOM对象。DOM "树"是指由DOM对象组成的任何树。DOM树中的对象可通 过对所述对象使用方法来寻址及操控。"D0M结构"是指DOM树或DMO树的片段。
[0020] 网络应用程序可遵循将应用程序划分成三个责任区域的用户接口的模型-视 图-控制器（MVC)设计模式：(a)模型：表示应用程序状态的域对象或数据结构；(b)视图， 其观察状态并为用户生成输出；及（c)控制器，其将用户输入翻译成操作模型。网络应用程 序常常遇到的一个问题为表示网络应用程序的DOM树是统一的且不提供任何封装抽象化。 这导致难以维持基元数据类型（例如，模型及视图）的逻辑分离。
[0021] 使用"影子D0M"（例如，参考图1至7更详细描述的插入点及其匹配准则）的实 施方案，可能在视图基元数据类型与模型基元数据类型之间提供更佳关注点分离。借助于 影子DOM，HTML文档由一系列模型组成，且每一模型为文档主体的子代。影子DOM子树创建 在文档主体上。这个子树表示视图。在这个子树中，一或多个插入点用作视图中的窗孔，模 型位通过其予以透视，且插入点的匹配准则被控制器用于指定在视图中显示哪个模型。匹 配准则可由〈内容〉HTML元素上的"选择"属性来表示。
[0022] 在控制器（例如，网络应用程序）修改这个属性值时，匹配准则发生改变，此情况 又触发代替这个〈内容〉HTML元素的呈现内容发生改变。网络应用程序的开发人员可指定 文档中的DOM元素为视图并改变匹配准则以匹配这些DOM元素中的任一者以代替〈内容 >HTML元素显现所述DOM元素，借此在视图内容与如何控制其选择之间提供清晰分离。模型 位从不改变或由控制器（或视图）以任何方式得知，即使在视图改变时也不改变。因此，可 操控、修改及增强网络应用程序的用户接口及用户接口的组件，而无需改变网络应用程序 模型的文档标记的基本代码。
[0023] 图1为网络应用程序框架的实例框图。在这个背景下，"网络应用程序"可经配置 以为用户执行单个任务或多个任务。在这个实施方案中，网络应用程序可经配置以由网页 浏览器执行或解译。这等同包含机器可执行代码且经配置以由处理器直接执行或经由客户 端装置的操作系统执行的本机应用程序，而网络应用程序可不能在没有网页浏览器的协助 下执行或显示。因此，网络应用程序可在具有专用用户接口的浏览器内部运行，且通常提供 比独立网站更丰富及具交互性但没有桌面应用程序那么繁琐及麻烦的功能性及体验。网络 应用程序的实例包含在浏览器内部运行的游戏、照片编辑器及视频播放器。
[0024] 网络应用程序开发人员经常需要提供DOM结构的封装。虽然为一个文档树的部 分，但可存在许多DOM功能片段（或DOM子树），以及关于这些独立操作片段的假设。这种 类型的封装被称为"功能封装"，与基于应用程序内的数据及状态的可信及有保证的安全性 处理有限信息流的"可信封装"相对。功能封装在文档树中建立功能边界。功能边界（或 "边界"）为两个松散耦合的功能单元之间的功能关注点的轮廓。
[0025] 网络应用程序用户接口可由若干用户接口元件（或"小部件"）组成，每一用户接 口元件表示DOM子树。在小部件的任务为托管其它小部件的情况中，小部件可需要获悉其 DOM子树终止于何处及另一小部件的DOM子树开始于何处。
[0026] 这需要在由外部角色（例如，耗用这些小部件的网络应用程序）操作一在文档树 中添加、移动或移除一小部件时观察文档树中的功能边界是否甚至更大。除非小部件顾客 准确知道如何设计小部件的DOM结构，否则顾客不可能对小部件进行合理操作。
[0027] 如图1中所描绘的实施方案中展示，实例应用程序容器110可包含"导航"小部件 112、"聊天"小部件114、"视图触发器1"小部件116、"视图触发器2"小部件118、"更多视 图"小部件120及"选定视图"小部件122。
[0028] 在网络应用程序模型化为DOM子树时，如图1中所展示，应用程序容器节点IlOA 可包含作为其子代子树的节点聊天114A，其又包含作为其子节点的视图面板116A及导 航112A。视图面板116A可包含作为其子代的视图触发器1117A、视图117B、视图触发器 2118A、视图118B等等、直到由视图触发器N 120A所说明的任何数目的视图触发器、及视图 N 120B。
[0029] 图2为影子文档对象模型（DOM)框架的实例框图。如图2中所展示，作为实例，文 档树210可包含影子宿主212及一或多个子节点213、214、215、216、217及218。文档树210 可包含任何数目的子节点。影子DOM子树220可例如由开发文档树210的网络应用程序开 发人员创建。
[0030] "影子D0M"结构容许多个影子DOM子树220 (除文档树210外）在被呈现（例如， 通过浏览器的呈现器进程，如下文更详细描述）时合成一个更大树。多个影子DOM子树220 的存在是通过使文档树210中的任何元素托管一或多个额外DOM子树（例如，影子DOM子 树220)来实现。这些影子DOM子树220可通过建立封装边界同时保留标准DOM可组合性 语义的规则集合来管制。
[0031] 影子DOM子树220之间的封装边界被称为影子边界230。托管影子DOM子树的元 素被称为影子宿主212,且影子DOM子树的根节点被称为影子根240。影子根240可具有一 或多个子节点，例如节点242、243、244、245、246及247。
[0032] 在一些实施方案中，实施图1及2中所描述的网络应用程序的网页浏览器可在多 进程架构中操作，使得单个浏览器进程管理网页浏览器的所有标签、窗口及"chrome"（例 如，用户接口，例如搜索栏、图标、网页浏览器的网页外区域）。浏览器进程可创建许多单 独呈现器进程（也被称为"呈现器"），其可各负责呈现网页。呈现器进程可含有用于处理 HTML、JavaScript、CSS、图像等等的所有复杂逻辑。每一呈现器进程在沙盒中运行，此情 况意味着几乎不可直接访问计算装置的磁盘、网络或显示器。与网络应用程序的所有交互 (包含用户输入事件及屏幕绘制）可经受浏览器进程。这使浏览器进程监控呈现器的可疑 活动，从而如果其怀疑