3.2 HTML DOM测试应用
阶段要点
● DOM的简单介绍。
● DOM在QTP中使用的时机。
● DOM对象与IE对象模型的结合应用。
● DOM在Web测试中的具体应用。
● DOM在Web测试中的显著优势。
3.2.1 了解DOM在QTP中应用的好处
3.2.1.1 什么是DOM
DOM全称为“Document Object Model”,从字面上来看叫做“文档对象模型”。它是一款主要应用于Web HTML中的一种独立的语言。在如今的网络时代,DOM一直被广泛应用着,基本上在任何地方都能够看到它的身影,随意打开一个网页的源代码就能找到。HTML DOM主要通过定义一套标准的对象通道接口,使得我们能够轻松地访问并控制HTML对象元素,它是一种用于HTML和XML文档的编程接口。作为开发人员可以通过DOM非常方便地控制文档对象中的属性、方法和事件。DOM的表现方法是一种树形结构。所有网页中最外层的元素都是<html></html>,称作DOM的顶层元素,里面还会有很多的子元素,这些元素都会把它视作为一个个节点,也就是node。通过Document对象就可以操控整个文档中的所有节点对象。下面是一段最简单的Dom应用脚本:
<html> <head> <script language = "vbscript"> Function helloworld document.write "test" End Function </script> </head> <body> <input type = "button" value = "click it" onclick = "helloworld"> </body> </html> |
在脚本中可以看到顶层元素为<html>,这个之前已经提过,接着就是头和身体两大元素,在body中可以看到一个子元素button,此元素含有一个点击事件,点击后即会触发script节点下的helloworld函数。此处函数中调用了document对象的write方法,当把以上代码保存为html文件后,点击button后即会执行helloworld方法,调用document.write,整个页面被写入test。那作为document这个可以操控整个文档对象的总入口究竟有哪些方法呢,让我们来看一下。
首先需要确保计算机里已经安装了Office。其次打开Office安装目录下的Office11\MSE7.EXE文件,此程序不管是对于DOM的查阅还是编写都是非常有帮助的。还有一个好处就是,不用另外安装其他软件,十分方便,接下来我们就来看一下它的威力。
新建一个HTML PAGE,输入上述代码,当想调用document对象的方法的时候,可以同时看到其他部分对象属性和方法,如图3-8所示。
图3-8
从图3-8所示可以看到此工具可以获取到document的部分属性和方法,以及进行代码提示,从而提高了开发人员编码的效率。由于很多工具都没有dom的提示,因此,在此处推荐这个Office附带的小工具。注意,为什么此处一直说是部分属性和方法,因为还有很多对象和方法被隐藏了起来,不过还是可以通过脚本定位跟踪法来查找其所有的方法。首先双击document对象,按下F1键后弹出document对象的帮助信息,如图3-9所示。
图3-9
如图3-9所示,选择All后就可以很方便地查看document下的所有方法属性事件了,并配有相应的语法说明和实例,非常的好用。讲了那么多DOM概念,接下来看一下DOM在QTP中应用的好处。