我使用的是魅族(魅蓝NOTE6 ),电脑是win 7系统,以下几步就可以轻松使用浏览器内置的功能调试移动端网页了:

注意:谷歌浏览器需要先FQ,不然调试页面会空白或者报404错误,(不会FQ的可以联系我 QQ:2417301781)

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

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

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

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

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

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

 

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

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

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

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

    谷歌输入(chrome://inspect/#devices) 我使用的是小米(红米NOTE2 ),电脑是win 10 系统,以下几步就可以轻松使用浏览器内置的功能调试移动端网页了: 1. 手机开启调 ...

  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 时间特效

    http://example.com:1234/test.htm#part2:Hash的作用. http://www.cnblogs.com/Interkey/p/RunAsAdmin.html

  2. java面试题之----super和this

    super和this的异同: super(参数):调用基类中的某一个构造函数(应该为构造函数中的第一条语句) this(参数):调用本类中另一种形成的构造函数(应该为构造函数中的第一条语句) supe ...

  3. thinkphp5设置403 404等http状态页面

    在thinkphp5中如何抛出异常状态码(比如401,403,404等),因为这些能极大的给用户以良好的体验. 因为在上线阶段,任何的系统错误信息都不能让浏览用户给看到,比如404(Not Found ...

  4. 如何通过一个SAPGUI屏幕反查这个屏幕对应的事务码

    假设我通过某种跳转方式打开了下图这个SAPGUI的屏幕,但我想搞清楚用哪一个事务码可以直接到达这个屏幕,而不通过繁琐的点击,应该怎么做? 步骤1,点击Order字段,按F1打开帮助界面, 点上图的图标 ...

  5. 最重要的“快捷键” IntelliJ IDEA

    转载:http://www.youmeek.com/intellij-idea-part-iii-hotkeys-explain/ @IntelliJ IDEA第三部分视频教程:最重要的“快捷键”专讲 ...

  6. MySQL:数据库入门篇2

    #移除主键时需要先解除递增,才能解除主键 alter table info modify id int null , drop PRIMARY key 一.用户权限 1.创建用户 create use ...

  7. Bokeh 学习

    这段时间由于在做K-means对文本进行处理,需要进行绘图,实验室编程大哥向我介绍了Bokeh来进行绘图,一直是根据自己的需求来进行对其探索,今儿个看到一篇博文,对Bokeh进行了详细的解说,做个笔记 ...

  8. 基于bootstrap模态框的二次封装

    一.参数设置 $.beamDialog(options); var defaults = { title:'标题', content:'内容', showCloseButton:true, //显示关 ...

  9. Android学习笔记_41_TabHost自定义标签和TraceView性能测试

    一.tabhost第一种用法,通过在帧布局放入定义好的page页面来实现,这样导致在当前activity下代码量比较大. 1.页面布局: |        |        |        |    ...

  10. 移动端Vue回到顶部

    html: <div class="totop" id="totop" @click="Top" v-show="totop ...