f12主要标签
1、元素（Elements）：页面元素的定位
用于页面元素分析，包括元素大小和元素布局，也用于自动化脚本元素定位。
（1）查看元素代码。点击左上角箭头图标，选择网页中的相应元素即可进行检查页面。
（2）查看元素属性
定位到元素的源代码，从源代码中查看元素的属性。eg：class、src、width等。
（3）修改元素的代码和属性
双击修改span标签，改为小源家
2、控制台（Console）：调试错误
（1）执行js语句
（2）查看当前网站的cookies信息，更改cookies值
控制台输入：consoli.log(document.cookie) document.cookie
document.cookie = '123456'
3、源代码（Sourse）：前端代码调试、断点
（1）查看文件：在源代码中可以看到当前网页的所有源文件，在左侧栏中展示。
（2）添加断点。
单击源代码左侧蓝色区域，单击给该行添加一个断点，再次单击取消断点。右键编辑断点条件。
（3）中断调试：添加断点后，当js代码运行到断点就会中断（对于添加了中断条件的断点在符合条件时中断
4、网络（Network）：抓包，定位测试问题
（1）网络抓包基本分析
network记录了接口信息，接口封装http协议-定义头部
http请求：请求行（请求方法）、请求头、请求体-客户端发送
http响应：响应行（响应状态码），响应头，响应体-服务器回应
HTTP响应状态码：
200(服务器收到我的请求并且给了我一个回应)
404（资源不存在或者地址给错了）
500 503（表明服务器有问题）
302 304 (重定向)
http请求方法：get、post、put、patch
详细报文内容：消息头、cookies、请求、响应、耗时
eg：百度登录页：
选中一条响应码为200的报文。标头包括，常规：请求地址，请求方法，状态码。响应标头和请求标头等等。
载荷：请求体
响应：响应体
6、内存（Memory）：
7、应用（Application）：存储cookie缓存
本地存储和会话存储的操作代码完全相同，区别在于存储数据的寿命。
本地存储：保存不受时间限制，用于长期保存网站的数据。
会话存储：临时保存一个窗口或标签页的数据，保存收到时间限制，窗口关闭，内容即可删除。用于保存从一个页面传递到下一个页面的数据。
cookies：存储访问过的链接，点击的按钮，登录的信息。还可以记住表单内信息，姓名性别年龄等等。
cookies组成：
name=value; [expires=date]; [path=路径]; [domain=域名]; [secure]
expires=date：表示cookies的失效时间，默认浏览器关闭时失效。
path=路径：访问路径，默认为当前文件所在的目录。
domain=域名：访问域名，默认在该域名下访问。
secure：安全设置，设置后必须使用https才能获取cookies
cookies用户鉴权：登录一次过后用户的一些信息保存到服务器里，以session的形式，即会话，服务器这边的会话也有一定的时效，服务器会把session的一些信息通过set cookies字段发送到客户端，客户端保存到浏览器中，也就是cookies的形式保存。
8、接口测试/数据篡改
qq邮箱登录页面
登录的包，右键-复制-fecth格式复制到控制台。
篡改body的信息，回车
