web自动化之基础篇

web自动化之基础篇

学习web自动化之前首先学习web页面的构成，正所谓的就是前端，前端页面是由html，css和js组成，学习前端对于我们做web自动化更加的容易。

前端基础

• html：页面结构：可以看做是个文档，展示页面内容的结构。
• css:页面表现：字体的颜色，布局，大小，隐藏或者显示，部分的动画效果。
• Javascript：页面的行为：页面的部分动画效果，和用户进行交互，页面实现的功能。（核心部分）

具体的标签请学习前端内容，这里就不做详细的介绍了，web自动化对标签的要求认识即可。。。。。。。。。今天主要介绍js的三个操作：

浏览器将整个html标签渲染成一个elements对象；document是文档对象模型，下面有很多html元素，每个html都可以看成一个节点；
document.querySelector(‘html’)
*queryselector选择器

在学习js的主要操作前先学会对元素进行定位。
一、js元素定位：
1.document.getElementById():通过元素的id属性去定位元素
2.document.getElementsByClassName():通过元素的class属性去定位元素
二、进行修改元素的属性(以百度为例)
1.定位元素
2.元素.属性名 = 属性值

修改readOnly属性:(以12306为例子)

三、js修改元素内容
1.定位元素
2.元素.innerHTML = ‘值’

修改文本属性有两种：innerHTML（可以加标签）
innerText（不能加标签）
四、js打开新的窗口

五、js滑动页面
1.相当于当前位置进行滑动：window.scrollBy(x,y),这里的x和y代表的是x轴和y轴，页面的左上角是坐标原点
x：横向滑动的像素
y：纵向滑动的像素
2.滑动到页面指定的位置：window.scrollTo(x,y)

js基本的操作到这啦，欢迎大佬进行指正留言。。。。。哈哈哈