[发明专利]对运行页面进行动态更新的方法

说明书

一种方法包括解析文本源文档来构造文档节点树，使得文档节点树包括与文档节点树的每一节点相对应的指示文本在文本源文档内的位置的文本偏移量。该方法包括从文档节点树构造文档对象模型（DOM）和表示该DOM的查看节点树。查看节点树的构造包括将查看节点树映射到文档节点树。该方法包括提供DOM的运行表示和以下之一：跟踪对DOM的修改以提供第一改变信息以及跟踪对文本源文档的修改以提供第二改变信息。

背景技术

web开发工具使得开发人员能够诊断超文本标记语言（HTML）和层叠样式表（CSS）问题。开发人员可动态地修改文档对象模型（DOM）元素（包括 CSS选择器）并在浏览器中的运行页面中立即查看所反映的改变。然而，为了将修改永久应用到产生该页面的标记文本源文档，开发人员需要定位并适当地修改与所需修改相关联的标记文本或起源JavaScript。然而，定位与所需修改相关联的源代码文本可能是困难的，因为相关联的源代码文本可能不是立即明显的或可能源于开发人员不熟悉的代码。另外，一旦定位了与所需修改相关联的源代码文本，就可能需要若干步骤来应用该修改并在浏览器中实际上看到该修改的结果。

发明内容

提供本概述是为了以简化的形式介绍将在以下详细描述中进一步描述的一些概念。本概述并不旨在标识出所要求保护的主题的关键特征或必要特征，也不旨在用于限定所要求保护的主题的范围。

一个实施例提供一种方法，该方法包括解析文本源文档来构造文档节点树，使得文档节点树包括与文档节点树的每一节点相对应的指示文本在文本源文档内的位置的文本偏移量。该方法包括从文档节点树构造文档对象模型（DOM）和表示该DOM的查看节点树。查看节点树的构造包括将查看节点树映射到文档节点树。该方法包括提供DOM的运行表示和以下之一：跟踪对DOM 的修改以提供第一改变信息以及跟踪对文本源文档的修改以提供第二改变信息。

附图简述

包括附图来提供了对各实施例的进一步理解，且这些附图被合并在本发明书内并构成其一部分。附图示出各实施例，并且与说明书一起用于解释本发明的原理。其他实施例和各实施例的许多预期优点将随着参考下面的详细描述进行更好的理解而得到认识。附图的元素不一定相对于彼此而缩放。相同的附图标记指代对应的类似部分。

图1是示出web开发工具的一个实施例的框图。

图2是示出适于实现图1中示出的web开发工具的各方面的计算设备/环境的框图。

图3是示出web开发工具的一个实施例的功能框图。

图4是示出映射到文档节点树的HTML文本的一个示例的框图。

图5是示出映射到查看节点树的文档节点树的一个示例的框图。

图6是示出浏览器实例所表示的DOM的查看节点树的一个示例的框图。

图7是示出在修改之前和之后的文档节点树的一个示例的框图。

图8是示出修改的改变记录的一个示例的框图。

图9是示出用于基于对标记文本源文档的修改对运行网页进行动态更新并用于基于对运行网页的修改对标记文本源文档进行动态更新的方法的一个实施例的流程图。

详细描述

在以下具体实施例中，对附图进行了参考，附图构成了实施例的一部分且在其中作为示例示出了可在其中实践本发明的各特定实施例。可以理解，可以使用其它实施例并且可以做出结构上或逻辑上的改变而不背离本发明的范围。因此，以下详细描述并不旨在限制，并且本发明的范围由所附权利要求来限定。

应理解，此处描述的各示例性实施例的特征可相互组合，除非另外具体注明。