博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
使用Chrome 浏览器调试移动端网页 chrome://inspect/#devices
阅读量:7014 次
发布时间:2019-06-28

本文共 1066 字,大约阅读时间需要 3 分钟。

hot3.png

以下几步就可以轻松使用浏览器内置的功能调试移动端网页了:

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

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

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

 

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

 

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

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

 

 

 

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

 

 

 

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

 

 

 

 

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

 

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

 

解决方案:

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

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

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

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

3) 点击重置,再次“启动检测”。

方案二: 使用adb启动

1) 使用内置adb包( , ),手动启动adb

运行 adb devices

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

3) 未找到设备,或者offline

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

  ② 重拔usb链接调试设备

  ③ 重启调试设备

  ④ 重启电脑...

方案三: 安装PC应用宝

方案四: 安装android SDK

转载于:https://my.oschina.net/jamesview/blog/1821903

你可能感兴趣的文章
理解 OpenStack 高可用(HA) (6): MySQL HA
查看>>
Linux系统的快速启动机制(内核切换) 【转】
查看>>
Python 判断文件是否存在,不存在则将名称写入指定文件
查看>>
Azkaban是什么?(一)
查看>>
AgileEAS.NET平台开发实例-药店系统-数据库还原
查看>>
android JNI 简单demo(2)它JNI demo 写
查看>>
Android 中PopupWindow使用
查看>>
你真的会玩SQL吗?EXISTS和IN之间的区别
查看>>
[Linux] 守护进程和守护线程
查看>>
PostgreSQL 语法分析中所使用的List
查看>>
颜色模式中8位,16位,24位,32位色彩是什么意思?会有什么区别?计算机颜色格式( 8位 16位 24位 32位色)【转】...
查看>>
oracle的rollup
查看>>
数据库反范式~有时候多点冗余是好事!
查看>>
PostgreSQL中的数组与Any
查看>>
如何给wordpress的编辑器添加一个自定义按钮,并且实现插入功能
查看>>
[外挂2] 鼠标单击事件
查看>>
No 'Access-Control-Allow-Origin' header is present on the requested resource解决办法
查看>>
tp5自定义扩展类的使用extend
查看>>
SilverLight动态加载控件<转>
查看>>
UNITY中有Timer
查看>>