Python3学习笔记_web自动化基础二_HTML_20200704
HTML,需要进行元素定位
-元素定位的依据
HTML的结构:
<html>
<head>页面的源信息和摘要信息</head>
<body>主体部分</body>
</html>
构成:
-标签名
-属性,ID,name,class,href,src
-子标签
-text 文本内容
所有的 HTML 的元素的构成部分都可以用来进行元素定位
查找:
F12:检查模式
elements:元素定位
styles:css,页面美化工作,美化页面样式
computed:计算,通过css来获取属性
eventlisteners:事件监听
console:输入js,前端调试
sources:关于js的操作
network:网络通信,与后端交互
performance:调试用的
memory:有关内存的
HTML 是一门编程语言吗?【一门编程语言是能够做到自动化处理某些事情,即动态处理】
不是
超文本标记语言,标记功能
HTML只能处理静态的
标签1:输入框
标签2:超链接
标签3:按钮
打标签的功能是为了快速查找
可以跟Python中的字典一样理解,
json:只包含数据,渲染数据
HTML:除了包含数据,渲染数据,还可以优化页面
json和HTML的相似之处:
<a></a>
{"a":内容}
<input>
{"input":..}
但是标签包含的内容会更加多,除了标签名之外,还有各种各样的属性,所有HTML包含的信息更加丰富一些
HTML的各种标签构成
<h1>1级标题</h1>
注释:快捷键:ctrl+/
<p>段落</p>
p标签也可以换行,但是p标签自动换行后,会空一行
手动换行:<br>
<div></div>:块元素,空盒子,非常常见,因为经常使用他去进行页面排版和优化
也可以完成换行,换行后不会空一行
水平线:
<hr>
列表:
<!--有序列表-->
<ol>
<li>lemon</li>
</ol>
<!--无序列表-->
<ul>
<li>lemon</li>
</ul>
表格:
<table border="2">
<tr>
<th>姓名</th>
<th>年龄</th>
<th>性别</th>
</tr>
<tr>
<td>lemon</td>
<td>18</td>
<td>male</td>
</tr>
</table>
内元素:<span></span>
超链接:
<a></a>
-需要和href属性绑定使用
-定位a标签:
-可以通过href属性定位
-通过text文本
img标签
-和src绑定
-经常和a标签组合使用:
要想点击img进入某个网址,可以结合 a 标签的href属性使用,把img标签放到 a 标签中,设置a标签的href属性即可
-如果img没有明显的特征,可以通过a标签定位,但不是所有的img都放到a标签里面
iframe
-可以嵌套另外的一个HTML页面
-可以使用src属性
input
-placeholder 可以设置输入框中默认显示提示语
-type 可以设置输入框中显示的格式,如果是密码格式,将type设置为:password后,显示...
只要设计到input,就要用到name属性
-type=radio,单选框,
-type=check-box,多选框
-type=file,文件选择控件
-type=color,颜色选择控件
-type=date,时间选择控件
select
-下拉框
-里面只有option <select><option>选择项1</option></select>
form
-表单
-提交表单到后端服务
-所有提交的内容所包含的标签都需要有name属性,不然只提交只有name属性的标签内容
-单选框或者是多选框提交的数据,都是通过value属性来获取的
HTML比较重要的属性
-name
-value
-href
-src
-id,非常重要,ID是唯一的
-同一个页面当中,ID是唯一的
-在不同的页面当中,ID可以与其他页面重复
-class 几乎每个标签都会有class属性,是使用最频繁的属性
-极大的概率能够使用class属性进行元素定位
-readonly,只读模式
-disabled,置灰模式,不是元素定位,而是我们会遇到某些情况
当定位某些输入框的时候,需要改变元素的属性,让他可以读写
当你发现某个元素不能读写的时候,检查源代码是否有readonly和disabled这个两个属性