'''
==================================
cooding:utf-8
@Time :2020/8/11 21:09
@Author :henry
@Email :yinpingwei@gmail.com
@File :web_day1.py
@Software:PyCharm
===================================
'''
'''
selenium -- web网页自动化 -- 功能自动化
前端:
由html + css + javascript 组成
html: 页面的内容表达
css: 样式布局
javascript: 动态处理页面+用户响应
标签对 - 标签名 - 定义好了的。
一个html页面当中,有非常多的标签对。也叫做元素。
标签对里是以键值对的方式来排列的
<标签名></标签名>
<标签名 属性名=值 属性名=值 属性名=值></标签名>
<标签名 属性名=值 属性名=值 属性名=值>文本内容</标签名>
所有的元素有3个特征:标签名、属性、文本内容
标签名 a: 表示是个链接,点击可跳转的
标签名 script src :是一个json脚本,不是页面的表达
1个页面有超多元素:
如何在页面有众多的元素当中,找一个符合条件的元素:
1.列表了特征
2.在页面的元素当中一个去遍历匹配
在页面上呈现元素,主要是写在body里面
例如:
type="text” 代表着文本
readonly 表示只读不允许写的意思
type="radio" 代表单选
type="checkbox" 代表多选
type="file" 代表上传
type="button" value="查看惊喜" 代表着按钮文字
disabled 表示不可点击,置灰
type="email" 代表着填写email
type="date" 代表着选择时间
type="password" 代表着输入密码
type="color"> 选择颜色
<img src="" alt=""> 填写img,tag键自动补全剩余的,代表着图片
1. src="" 表示图片的来源地址
2. alt=""
<a href=""></a> 填写a,tag键自动补全剩余的,代表着链接
1. href="" 表示链接地址
<!-- !快级元素?--> ctrl+/
<div></div> 填写div,tag键自动补全剩余的
1.不代表任何东西,就像一个表格一样,可以在里面放东西,各种链接
2.是一个分块的组
<span></span> 填写span,tag键自动补全剩余的
1.就一行文本,
<ul></ul> 填写ul,tag键自动补全剩余的
<li></li> 填写li,tag键自动补全剩余的
1.都是表单,填写文字的
<table></table> 填写table,tag键自动补全剩余的,这个是表格,
<th></th> 这个代表表头
<tr></tr> 这个代表行
<td></td> 这个代表列
select>option 这个代表下拉列表,tag键自动补全剩余的
1.option 是选项
<iframe src="xxxx" frameborder="0"></iframe> iframe,tag键自动补全剩余的
1.代表着框架,框架镶嵌框架
<textarea></textarea> 这个表示多文本域,也叫富文本
<br> 代表换行
<h1>xxx</h1> 表示大标题的呈现,有1-6个级别
<from></from>表单元素
<action> 表示提交到后台,需要json处理
弹框有两种:
1.第一种是html弹框,可以定位的
2.第二种是弹框是不可以定位的,是最顶层的,是由js来表达的,有三种
2.1 第一种是:alert("xxxxx") 弹框只有确定按钮,是没有输入的
2.2 第二种是:confirm("xxxx") 弹框有确认和取消按钮,是没有输入的
2.3 第二种是:prompt("xxxx?") 弹框有确认和取消按钮,是可以输入的
哪些属性所有元素都可以有:
style : 内联样式。直接在元素上通过style属性来设置样式。 display:none 隐藏不显示。
id: 身份证。在页面当中,id值不会重复。唯一性。 可能是变动的(每次访问时id不一样)
class: 类。class值不是唯一的。一个元素可以有多个class值,用空格隔开。
name: 不唯一。低于id的一个可以用来识别元素的特性。
紫色的是标签名
棕色的全是属性 属性后面的是值
黑色代表文本内容
元素的状态:
存在 - 存在于html当中。
可见 - 在存在html的前提之下,有可见和不可见。
可用 - 在可见的前提之下,元素有可用和不可用。
'''
**
html练习文件
**
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>py30</title>
</head>
<body>
<from>
<h2>py30 自动化网址</h2>
请输入你的用户名:<input id="ww" name="nb" type="text" readonly>
<br>
请选择你的性别:<input type="radio" name="sex">男 <input type="radio" name="sex">女 <input type="radio" name="sex">人妖
<br>
请选择你的兴趣爱好是:<input type="checkbox">看书 <input type="checkbox">睡觉
<input type="checkbox">动漫 《斗罗大陆》 <input type="checkbox">学习python自动化
<br>
请上传你的靓照:<input type="file">
<br>
请点击按钮:<input type="button" value="查看惊喜!" disabled>
<br>
请确认你的时间:<input type="date">
<br>
请输入你的邮箱:<input type="email">
<br>
请输入你的密码:<input type="password">
<br>
请选择你的颜色:<input type="color">
<br>
<img src="https://www.baidu.com/img/PCtm_d9c8750bed0b3c7d089fa7d55720d6cf.png" alt="" width="400" height="260px;">
<br>
<a href="http://www.baidu.com">点我一下,就去百度</a>
</from>
<!-- !快级元素?-->
<div>
<div></div>
<a href=""></a>
<img src="" alt="">
<span>py30自动化测试</span>
</div>
<div>
<ul>
<li>py30-学习</li>
<li>py30-树胶</li>
<li>py30-运动</li>
</ul>
<table>
<th></th>
<tr></tr>
<td></td>
</table>
</div>
<select name="我的爱好" id="hobby">
<option value="动漫">动漫</option>
<option value="动漫">睡觉</option>
<option value="动漫">美食</option>
<option value="动漫">学习</option>
<option value="动漫">唱歌</option>
</select>
<br>
<iframe src="http://www.baidu.com" frameborder="0"></iframe>
<textarea></textarea>
</body>
</html>