chrome开发者工具备忘

参考
Chrome developer tool介绍(javascript调试)
Chrome DevTools 之 Profiles,深度性能优化必备
chrome web前端调试技巧
JS内存泄漏排查方法
JS内存泄漏排查方法——Chrome Profiles

1.Elements左上角那个按钮,在页面上选不同的元素,Elements里会跳转到相应的代码

Paste_Image.png

2.网上的js一般是压缩过的,阅读压缩过的javascript肯定是不是人能进行的,更别说添加断点了。在 Scripts 面板下面有个 Pretty print 按钮(这种符号 {}), 点击会将压缩 js 文件格式化缩进规整的文件, 这时候在设定断点可读性就大大提高了。

3.Network里可以限速,甚至是断线。

4.跨域--allow-file-access-from-files 命令的使用

5.如何在手机上打开控制台需要能翻墙
参考如何在移动设备上调试html5开发的网页

6.Chrome 控制台console的用法

7.Save All Resources

经常在仿站的时候回遇到下载别人的图片、css、js等资源,发现要一个个的手动下载。直接使用仿站工具有时候觉得比较麻烦而且会打乱目录结构。博主找了大半天,终于找到了一个比较神奇的Chrome插件:Save All Resources

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 在做前端开发时,我们需要用到一些调试工具用来调试我们的HTML、CSS或者JS代码,俗话说预先善其事必先利其器,这...
    Rella7阅读 24,174评论 0 15
  • chrome扩展开发入门教程 最近在开发chrome插件,看到一篇非常适合入门的教程,特记录一下 注:转载 本文首...
    谢大见阅读 11,503评论 1 25
  • 前言 相信无论是对于身居一线的coder,还是退居多年的老司机managers来说,对于调试程序是不陌生的,对于w...
    itclanCoder阅读 7,469评论 0 7
  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 175,270评论 25 709
  • 紫宁,我的小公主,请记住,以后你的人生需要自己奋斗,说什么也要靠自己,因为你的爸爸给不了你什么,你的妈妈只能教你学...
    曾紫宁阅读 3,355评论 0 0