谷歌输入(chrome://inspect/#devices)

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

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包( win下载mac下载),手动启动adb

运行 adb devices

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

3) 未找到设备,或者offline

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

  ② 重拔usb链接调试设备

  ③ 重启调试设备

  ④ 重启电脑...

方案三: 安装PC应用宝

方案四: 安装android SDK

用Chrome 浏览器调试移动端网页 chrome://inspect/#devices的更多相关文章

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

    我使用的是魅族(魅蓝NOTE6 ),电脑是win 7系统,以下几步就可以轻松使用浏览器内置的功能调试移动端网页了: 注意:谷歌浏览器需要先FQ,不然调试页面会空白或者报404错误,(不会FQ的可以联系 ...

  2. Chrome浏览器调试移动端网页,测试人员也可以轻松debug

    现在的产品,移动端应用占据很大市场,在测试过程中,就会测试各种各样的移动端页面.测试过程,或多或少会发现些问题,无非就是前端.后端问题.后端接口问题,可以利用工具:Fiddler或charles抓包查 ...

  3. 使用chrome浏览器调试移动端网页(非模拟访问)

    1. 使用数据线连接手机与电脑 2. 打开手机调试模式 参考:http://jingyan.baidu.com/article/f79b7cb35ada4d9145023e63.html 本人使用的m ...

  4. Chrome浏览器如何调试移动端网页信息

    Chrome浏览器如何调试移动端网页信息 2017年08月12日 12:42:20 阅读数:835 最近在弄项目,用WebView加载一个页面,想追踪页面中一个按钮的点击事件.这个可能就需要调试这个页 ...

  5. 用mac的chrome浏览器调试Android手机的网页

    一.参考链接 read chrome remote debugging documentation 调出开发者选项 二.设置android 在安卓4.2及更新的版本中,默认情况下,[开发者选项]是隐藏 ...

  6. Google Chrome浏览器调试入门————转载只为自己查看方便

    Google Chrome浏览器调试 作为Web开发人员,我为什么喜欢Google Chrome浏览器 [原文地址:http://www.cnblogs.com/QLeelulu/archive/20 ...

  7. chrome浏览器调试功能之后端篇

    作为后端开发人员,可能有很多同学不怎么了解chrome调试功能,而即将成为大神的我们,怎么也得会,知其然更要知其所以然,今天我带领大家好好的梳理一下,chrome浏览器调试,个人把它分成了前端功能和后 ...

  8. 利用扩展双屏技术及Chrome浏览器,高速剖析优秀网页Div及CSS构成,并高效实现原型创作

    作为一个Web前台设计人员,应该充分利用可利用的硬件条件及专业的软件工具,迅速进入到高效氛围其中.实践中,我们能够利用扩展桌面双屏技术及Chrome浏览器高速剖析优秀网页Div及CSS构成,并高速实现 ...

  9. flex chrome浏览器调试flex程序

    flex chrome浏览器调试出现空白的解决方法: 1,为chrome安装flash player,禁用chrome自带的flash player:参考:http://www.jb51.net/ar ...

随机推荐

  1. JS实战篇

    实现选项卡的选择: 效果图如下: 代码如下: <!DOCTYPE html> <html> <head> <meta charset="UTF-8& ...

  2. java:LeakFilling(Servlet,JSP)

    1.web-inf中的  .jsp 文件不会运行,其他都根据web.xml文档中的自然顺序进行运行 2.keep-alive 长连接(持续)  UDP,TCP短连接 3.状态码:1(消息异常) 2(成 ...

  3. 未能加载文件或程序集“microsoft.Build.Engine, Version=3.5.0.0,...”或它的摸一个依赖项。

    今天想打开IIS服务,然后点错了,不小心关掉了.net组件,结果vs就一直打不开项目,最后在网上查到了原因,打开 控制面板->程序和功能->打开或关闭功能 在里面勾选Microsoft . ...

  4. Linux c实现一个tcp文件服务器和客户端

    总体需求:编写tcp文件服务器和客户端.客户端可以上传和下载文件. ================================================ 分解需求 客户端功能描述: 1)要 ...

  5. PTA 7-20 表达式转换

    转自:https://www.cnblogs.com/yuxiaoba/p/8399934.html 算术表达式有前缀表示法.中缀表示法和后缀表示法等形式.日常使用的算术表达式是采用中缀表示法,即二元 ...

  6. Nginx教程(一)-全面认知

    什么是 nginx nginx 是一款高性能的 http 服务器,反向代理服务器,电子邮件(IMAP/POP3)代理服务器: 它的特点就是高性能,占用内存少,支持高并发,运行稳定: 官方测试 可支持 ...

  7. 根据ip获取地理信息.php

    根据ip获取地理信息.php <?php function getIPLoc_sina($queryIP){ $url = 'http://int.dpool.sina.com.cn/iploo ...

  8. php文件上传错误信息说明对照表

    php文件上传错误信息说明对照表: UPLOAD_ERR_OK:其值为0,没有错误发生,文件上传成功UPLOAD_ERR_INI_SIZE:其值为1,上传的文件超过了php.ini中upload_ma ...

  9. element-ui使用el-tabs组件的时候浏览器直接卡死的问题

    遇到这个问题的原由是:本身自己项目的elementUI版本是2.0.11较低了,项目有个功能是自定义progress进度条颜色,无奈高版本的才有这个配置,所以就升级了elementUI,升级到了最高版 ...

  10. 在Asp.net core使用配置Json创建动态目录树

    一.前言 使用动态目录树可以使左边栏中的目录更加灵活,本文介绍如何将目录保存在json配置文件中,再读取出来经过处理后生成目录树. 二.数据结构 1. TreeMenuNode类名 将TreeMenu ...