Chrome 和 Firefox 中 developer 模式使用技巧 tips
Chrome 和 Firefox 中 developer 模式使用技巧 tips
本文以Chrome
为主,以Firefox
为辅,大致相同不在详细描述,特殊地方单独提示tips
01)配置网速
Chrome
中 F12—>选择Network—>有红色圆点的最右侧
02)查看伪类样式
查看伪类:active,:hover,:focus样式
03)截图
chrome
和 Firefox
中截图 screenshots firefox,Firefox
中直接右键也可以截图
04)重新发起网络请求
05)复制变量
复制JavaScript
变量到其他地方
06)表格展示变量
使用console.table(xxx)
,在Chrome
中可以直接使用table(xxx)
,并且结果可以排序
07)拽DOM
元素
在控制台Elements
中,选中某个元素可以自由拖拽
08)复制响应response
信息
复制响应结果response
数据
09)查看绑定事件
10)应用页面DOM
Chrome
和 Firefox
中显示不一样
$("#id") 回车可以显示dom结构,并且可以修改
其他