Chrome-浏览器调试移动端网页 chrome://inspect/#devices

我使用的是小米(红米NOTE2 ),电脑是win 10 系统,以下几步就可以轻松使用浏览器内置的功能调试移动端网页了:

1. 手机开启调试模式连接电脑,确保是调试模式连接的(不知道怎么打开调试模式的可以参考:http://jingyan.baidu.com/article/046a7b3ee3b565f9c27fa9b2.html);

2. 手机上打开一个网页,只要是webview形式的网页应该都是可以的;

3. 电脑chrome浏览器地址栏输入:chrome://inspect/#devices ,会看到如下图的情况(上面会看到你所连接的设备的名称和信息,下面就是当前设备上可以用于在电脑上调试的页面的一下信息,地址、标题、网页大小。。。,如果没有显示设备信息,则表示没有连接好,可以插拔手机或关闭调试模式重开一下);

Chrome-浏览器调试移动端网页 chrome://inspect/#devices_第1张图片
image.png

4. 找到你准备调试的那个,并且确保手机上的那个页面也是处于激活状态的的,然后点击蓝色的 inspect 链接,会弹出一个新的窗口;

Chrome-浏览器调试移动端网页 chrome://inspect/#devices_第2张图片
image.png

5. 熟悉的界面出现了,接下来你应该知道怎么用了,(恭喜!!!)

检查元素↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓

Chrome-浏览器调试移动端网页 chrome://inspect/#devices_第3张图片
image.png

控制台↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓

Chrome-浏览器调试移动端网页 chrome://inspect/#devices_第4张图片
image.png

查看网络情况↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓

Chrome-浏览器调试移动端网页 chrome://inspect/#devices_第5张图片
image.png

最后补充一下, 实在连接不成功, 可以尝试使用微信官方给的这个办法, 使用 adb 工具进行 运行命令 adb kill-server -> adb start-server -> adb devices

4. 电脑死活adb连接不成功?

解决方案:

方案一: 确保USB与PC的连接

  1. 请确保USB连线能正常连通PC和手机(非常重要呀!)

简单确认方法:手机状态栏显示为充电状态。

  1. 请确保PC的USB驱动已正常安装,可以在控制面板“设备管理器” “通用串行总线控制器”中确认无异常USB设备显示。

  2. 点击重置,再次“启动检测”。

方案二: 使用adb启动

  1. 使用内置adb包( win下载, mac下载),手动启动adb

运行 adb devices

  1. 找到设备,点击重置,再次“启动检测”

  2. 未找到设备,或者offline

① 运行命令 adb kill-server -> adb start-server -> adb devices

② 重拔usb链接调试设备

③ 重启调试设备

④ 重启电脑...

方案三: 安装PC应用宝

方案四: 安装android SDK

你可能感兴趣的:(Chrome-浏览器调试移动端网页 chrome://inspect/#devices)