1. 手机端：chrome for Android,；
2. PC端：安装谷歌浏览器(最好是最新版的开发者版本)
3. USB 连接线, 也就是你充电器的那条线

开启调试模式

使用 USB 连接你的电脑，并开启调试模式。 使用 android 4.2 或以上的手机可能没有调试模式选项，可以找到 “设置 > 关于手机 > 版本号(Build Number)”, 点 7 次，然后返回开发者选项就可以了。

查找 USB 设备 （Enable USB discovery in Chrome）

在你的桌面版的 chrome ，打开 菜单 > 工具 > 检查设备。 勾选Discover USB devices。稍等片刻，你的手机会提示你是否允许调试，接受调试即可。接受调试后，可能需要等一下 chrome 才能检测到你的手机。如果没有检测到，可以试一下重启浏览器。

检测到你的手机后，点击 inspect，弹出开发者工具，这样你就可以像调试桌面页面那样调试手机页面。
chrome 远程调试

浏览器 是对服务器返回 的 数据 进行 解析与渲染，通过 浏览器 的 开发者 工具 可以对源码 进行 分析，有一句老话叫可见即可爬，博主以 Chrome 为列，把学习 的 过程记录下来，如果有问题，欢迎留言纠正 开发者 工具 栏简介 浏览器 打开百度 的 地址，通过F12调出 开发者 工具 ，这里简介下 工具 栏 元素(Elements)：用于查看或修改HTML元素 的 属性、CSS属性、监听事件、断点 控制台(Console)：控制台一般用于执行一次性代码，查看JavaScript对象、查看 调试 日志与异常 的 信息 源代码(Sources)：该面板用于 Android移动端 浏览器 环境验证与测试，可 使用 vConsole[1], weirne[2], chrome remote debug[3]等方式验证。当然最理想 的 方法是 chrome remote debug，通过 chrome 可以 使用 调试 控制台 调试 js，观察网络面板及性能面板等。 在国内 使用 chrome 调试 需要翻墙，否则会出现404页面，无法 调试 ， 使用 不便。因此若能有一种和chrom... 在阅读下面内容之前，那么些简单 的 了解 浏览器 开发者 工具 到底是什么东西，到底有什么用途。 浏览器 开发者 工具 到底是什么？ 其实简单 的 说， 浏览器 开发者 工具 就是给专业 的 web应用和网站开发人员 使用 的 工具 ，当然只要你有兴趣想要了解，只要你对这个世界充满这好奇，什么东西你都可以了解。 开发者 工具 到底有什么用？ 它 的 作用在于，帮助开发人员对网页 进行 布局，比如HTML+CSS，帮助前...