tanyaonan.github.io

Chrome 技巧

一、浏览器截图

1. 打开 F12 开发者工具
2. 键盘输入指令 Ctrl + Shift + P
3. 指令
   • Capture full size screenshot 长截图
   • Capture screenshot 一般截图
   • Capture node screenshot 预览截图
   • Capture area screenshot 自选区域截图

二、浏览器调试

1. 接口重发
   • 使用原来的参数：Replay XHR
   • 修改参数后重发：Copy -> Copy as fetch 然后在console面板粘贴运行即可
2. $0 用法
   • 选中元素后可在console面板使用 $0 进行事件配置、事件获取、设置元素样式等操作
3. console 方法使用
   1. 一般使用
      • log：输入日志信息
      • warn：输出警告信息
      • error：输出错误信息
   2. 代码执行时间
      • time()：开始
      • 中间执行代码
      • timeEnd()：结束并且输出统计值
   3. 其他使用
      • table：以表格形式输出数据
      • dir(obj, {depth: null})：输出并且显示深层折叠的对象