自动化测试学习之路--json、dom编程

1.json:

json是JavaScript Object Notation,是一种数据传输格式。

以下程序都是在浏览器的Console下执行的。

创建一个javaScript的对象：

var student={id:'10001',name:'claire',loveSport:['pingpang','run','yoga'],};

之后将其序列化为json格式的数据：

var jsonStu=JSON.stringify(student);

此时输出jsonStu为："{“id”:“10001”,“name”:“claire”,“loveSport”:[“pingpang”,“run”,“yoga”]}"

这种格式的不好看，可以加上几个参数：

JSON.stringify(student,['id','name'],' ');

输出结果为（与我们在平时测试见到的格式相同）：

"{"id": "10001","name": "claire"
}"

还可以将Json格式数据反序列化为一个javaScript的对象。

JSON.parse();

想了解更多关于反序列化的内容，可以到菜鸟教程上学习下。网址：http://www.runoob.com/js/javascript-json-parse.html

2.方法

function add(a,b){alert(a+b);
}
add(10,20)；

声javaScript中，参数不需要声明形参类型、返回值类型。直接用function 方法名（形参1，形参2）{方法体}

3.dom编程

dom是 document Object Model，文档对象模型。

简单来说，当我们打开一个网页，页面加载完成后，浏览器就会自动创建该页面的dom(文档对象模型,就是该页面的一个对象)，通过该对象就可以访问该页面的所有元素。

我们做web自动化测试的时候，通常需要捕获到某个元素，并对其进行操作。其原理就是通过dom模型（网页对象）去获取所要捕获的元素。

下面讲一下用js来获取并操作html的元素。

浏览器上打开一个窗口，首先是会生成一个wondows的对象。是JavaScript中的顶层对象，是document的父节点。代表是在浏览器上打开了一个窗口。

document是代表窗口中显示的页面，表示当我们打开一个网页，网页内容加载完毕后。是windows的子节点。通过该节点可以遍历到html中的所有子节点。对应的事件是：wondows.onload如果该时间完成后你需要完成一系列的操作，此时就需要为该事件注册一个方法。
注册方式为：

<script>window.onload=function (){var a=document.getElementById('10001');alert(a);}
</script>

我们自己创建了一个html文件，其中有输入框的id为10001。上面就获取到了该元素，并弹框显示了该元素。

其中：

document.getElementById(''),(method) Document.getElementById(elementId: string): HTMLElement
Returns a reference to the first object with the specified value of the ID or NAME attribute.

可以看到返回的是一个对象的引用。当我们想获取到该对象的value值时，可以用a.value即可

还有其他方式可获取元素：

举例：

alert(document.getElementsByClassName('class1')[0].value);
alert(document.getElementsByClassName('class1').length);
alert(document.getElementsByTagName('input')[1].value);
alert(document.getElementsByTagName('input').length);

还可以获取到超链接（a标签）中的文字和html：

console.log(document.getElementById('10002').innerText);
console.log(document.getElementById('10002').innerHTML);

其他事件的常用事件：

a.onblur=function(){alert('失去焦点')}a.onfocus=function(){alert('聚焦')}a.onchange=function(){alert('内容改变')}a.onclick=function(){alert('点击事件')}a.ondblclick=function(){alert('双击事件')}a.onmouseover=function(){alert('鼠标上浮事件')}

自动化测试学习之路--json、dom编程相关推荐

mavlink协议_MAVLink学习之路05_MAVLink应用编程接口分析
说明: 本文原创作者『strongerHuang』首发于微信公众号『嵌入式专栏』,同时也更新在我的个人网站:EmbeddedDevelop 一.写在前面前面写的几篇文章你掌握了,说明你离成功很近了 ...
python支持多种编程范式吗_Python3学习之路~6.1 编程范式：面向过程 VS 面向对象...
编程范式编程是程序员用特定的语法+数据结构+算法组成的代码来告诉计算机如何执行任务的过程,一个程序是程序员为了得到一个任务结果而编写的一组指令的集合,正所谓条条大路通罗马,实现一个任务的方式有很多种 ...
小白学习之路，网络编程（上）
一,计算机网络基础在讲网络编程之前,先跟大家简单的介绍一下一些网络相关的知识. 在最早之前,两台电脑之间通信是通过电脑的mac地址找到对方,并实现相互通信.当然每台电脑都只存在唯一的mac地址,在生 ...
Java学习之路12——GUI编程
组件:窗口.弹窗.面板.文本框.列表框.按钮.图片.监听事件.鼠标.键盘事件一.简介 GUI的核心开发技术:Swing AWT. 弊端: 页面不美观需要jre环境学习的必要性可以写出自己心中想 ...
Java学习之路002——面向对象编程
[说明]部分内容来源于网络,如有冲突,请联系作者删除. 一.面向对象编程(OOP) 2.1 对象和类的关系 2.2 面向对象的特征 2.2.1 封装 2.2.2 继承 2.2.3 多态 3.抽象使用 ...
自动化测试学习之路--java String、StringBuilder
Java中的String和StringBuilder类: 1.String对象是不可变的.每一个看起来修改了String值的方法,实际上都是创建了全新的String对象.代码示例如下: String ...
自动化测试学习之路--HTML常见元素、属性的简单学习
如何创建html文件: 使用工具:VSCode 1.双击文件名显示区,可快速新建文件. 2.保存文件,文件名.html 3.输入!(必须是英文的!),按 Tab键,可自动生成html格式的文件,如下: ...
自动化测试学习之路--java 数组
数组的定义与为数组元素分配空间和赋值是分开进行的,称为动态初始化. 在数组定义的同时就为数组元素分配空间并赋值,称为静态初始化. 一维数组举例: //动态初始化int[] intArr;intArr= ...
写给编程初学者的一篇文章，该如何学习编程？我的编程学习之路
我的编程之路当初还没有学习编程的时候,真心觉得编程好难啊,这是人学的吗?怎么全是符号字母?这都是啥啊?真的是让人满头问号,目前编程行业工资比较高,很多人都想学一下编程,但又不知道从哪里开始学习,我觉 ...

自动化测试学习之路--json、dom编程

自动化测试学习之路--json、dom编程相关推荐

最新文章

热门文章