selenium之HTML基础知识
在学习selenium做UI自动化时，必不可少的是前端页面的元素定位，因此大概了解下HTML知识是相当有必要的啦，因此将在写自动化脚本时需要HTML知识粗略整理了一下~第一次在博客园写博客，排版不太友好，需要的小伙伴将就着看下咯~
HTML（Hyper Text Markup Language），超文本标记语言，使用标记标签来描述解释网页。
HTML文档即网页，包含标签和纯文本。标签不会显示在浏览器上，浏览器显示的时候文本的内容。常见标签如下：
标签尖括号、成对出现（开始标签和结束标签）。
标题（Heading）是通过 <h1> - <h6> 等标签进行定义的，<h1>最大，<h6>最小。浏览器会自动在块级元素前后添加一个额外的空行。
<!-- 注释 -->。
<html>描述网页</html>
<body>可见的页面内容</body>，定义了HTML文档的主题。
<p>段落</p>
<div>块级元素，能用作其他HTML元素的容器</div>
<span>行内元素，用作文本的容器</span>
<a href="http://baidu.com">this is a link</a>，此时this is a link即为一个链接，指向百度首页。<a>标签定义超链接，最重要的熟悉是href属性。
<img src="abc.jpg" width="104" height="142" />，插入一张图片并定义了其宽和高。
元素标签的<></>之间的内容即为元素。
空元素：<hr/>创建水平线、<br/>代表换行，空元素即没有内容的HTML元素，在开始标签中关闭。
HTML文档由嵌套的元素构成，html嵌套body，body嵌套p等。
属性在开始标签中规定，以键值对形式出现。
eg：<h1 align="center"> 拥有关于对齐方式的附加信息。align="center"即为属性。常用属性如下：
| 属性 | 值 | 描述 |
|---|---|---|
| class | classname | 规定元素的类名（classname） |
| id | id | 规定元素的唯一 id |
| style | style_definition | 规定元素的行内样式（inline style） |
| title | text | 规定元素的额外信息（可在工具提示中显示） |
类即对相同的元素设置相同的样式，一般在<head>之间添加<style>标签.类名{属性}</style>，在元素中引用该类，eg：<span class="类名">引用该样式的元素</span>。
iframe用法，结合代码来理解：
<iframe src="demo_iframe.htm"name="iframe_a"></iframe> <p><a href="http://www.w3school.com.cn" target="iframe_a">W3School.com.cn</a></p>
http://www.w3school.com.cn网址的内容将在src="demo_iframe.htm"这里打开。
form表单属性如下：
| 属性 | 描述 |
|---|---|
| type | text（定义常规文本输入），radio（定义单选按钮输入），checkbox（复选框）、submit（定义提交按钮）。 |
| accept-charset | 规定在被提交表单中使用的字符集（默认：页面字符集）。 |
| action | 规定向何处提交表单的地址（URL）（提交页面），即处理表单的程序。 |
| autocomplete | 规定浏览器应该自动完成表单（默认：开启）。 |
| enctype | 规定被提交数据的编码（默认：url-encoded）。 |
| method | 规定在提交表单时所用的 HTTP 方法（默认：GET，表单数据在页面地址栏可见）。如果表单正在更新数据，或包含敏感信息则用POST |
| name | 规定识别表单的名称（对于 DOM 使用：document.forms.name）,每个input字段后必须设置一个name。 |
| novalidate | 规定浏览器不验证表单。 |
| target | 规定 action 属性中地址的目标（默认：_self）。 |
表单元素
<input>，输入类型type如下（并不是所有浏览器都支持下面的属性）：
- text：文本输入
- password：字符会被做掩码处理即显示为星号或圆点
- submit：提交表单数据至表单处理程序的按钮
- radio：定义单选按钮，即圆圈
- checkbox：定义复选框
- button：定义按钮，和onclick属性一起使用，onclick的值为点击按钮后调用的方法
- number：数字输入
- date、month、week、time、datetime：出现日期、周、时间选择器等
- color：颜色选择器
- range：显示为滑动控件
- email、search、tel、url：这些会使键盘自动添加相应的字段来匹配类型。
<select>,下拉元素，如下，<option>元素定义待选择的选项：
<select name="cars"> <option value="volvo" selected>Volvo</option> //selected属性可以定义预定义选项
</select>
<textarea>定义多行输入字段（文本域）。
<button>定义可点击的按钮。
<datalist>设置预定义值。<input> 元素的 list 属性必须引用 <datalist> 元素的 id 属性。有些浏览器不支持该元素。
