谷歌浏览器开发者工具的作用
来源:互联网 发布:中学学校网络管理制度 编辑:程序博客网 时间:2024/05/29 07:17
就是下面这一行常用工具:
1.Elements:这个大家经常用,肯定很熟悉了。元素面板,用来操作DOM和样式,可以 直接在上面进行编辑。
2.Console: 控制台,可以在代码中通过console.log(data)来打印出数据,也可以直接在控制台输入javascript进行操作,直接获取元素。
3. Sources: 这里是页面的源代码,最常用的功能就是进行断点调试,顾名思义就是你可以设置在某一个节点进行调试,这一功能是每个前端程序员必备的技能,如果你还不会,赶快去学习吧。
4.Network: 这里是网络请求,记录当前页面的网络操作,包括详细的时间,http请求和相应,cookies等。
点开之后,有几个常用的操作:
Headers,这里是http请求的核心,包含了请求页面,服务器等相关的信息。
Preview,这里是传递的Json数据,
Response,这里是响应服务器对浏览器请求的文件或数据。
Timing,这里是各种时间,等待时间,连接时间,上传时间,下载时间等。
5.Performance,这里是性能测试,可以通过查看请求开始和结束的时间,来查找加载速度过慢的原因主要实在哪一部分。
6.Memory:从来没用过,里面都是一些配置和分析。
7.Application:可以检查加载的所有资源,应用缓存,数据库,cookies,图片等。
8.Security:可以再面板当中调试安全问题。
9.Audits:这个面板可以分析页面加载过程,可以提供减少页面加载时间,提升反应速度的方案。
阅读全文
0 0
- 谷歌浏览器开发者工具的作用
- 调用 IE 浏览器的开发者工具
- chrome浏览器开发者工具的使用
- chrome浏览器开发者工具的使用
- 前端浏览器开发者工具的使用
- qq浏览器的两种开发者工具
- 不同浏览器上的开发者工具
- Chrome浏览器开发者工具
- 【前端】谷歌开发者工具的使用
- Google浏览器开发者工具 快捷键
- JavaScript 使用浏览器开发者工具
- Chrome浏览器开发者工具-----Network
- F12开发者工具新功能-内存分析的作用
- F12开发者工具新功能-内存分析的作用
- chrome浏览器开发者工具的使用以及调试js
- Chrome浏览器获取XPATH的方法----通过开发者工具获取
- chrome浏览器自带的开发者工具查看http头
- Firefox、Chrome、IE浏览器开发者工具的使用
- Linux应用
- Linux 虚拟机网络配置
- <s:select>表单回显问题
- Java精选笔记_Java编程基础
- MyBatis框架之初探
- 谷歌浏览器开发者工具的作用
- 基于Windows Server 2008 系统的DNS服务器搭建与FTP服务器实现-《网络协议分析》实验
- 212. Word Search II
- 整数分解为指定元素的加法表示:找零钱
- CentOS7文本模式下修改分辨率
- CentOS 7 上安装 redis3.2.3安装与配置
- python:自定义类中迭代行为的实现
- Linux 学习笔记2015(基础篇)
- 读书思考