最早开始调试移动端网页时,本人都是采取PC上改几行代码,手机上刷新一下看效果这种笨方法来开发的,效率低而且容易让人抓狂。最近偶然发现原来可以使用PC上的浏览器来调试移动设备,不由得感叹相逢恨晚。

  工具:

  • Chrome浏览器(PC)
  • Chrome Dev浏览器(移动设备)  

  步骤:

  • 在移动设备上安装Chrome Dev浏览器,可以在软件市场找到,安装完成后用该浏览器打开需要调试的网页
  • 在Chrome(PC)上输入chrome://inspect/
  • 将移动设备通过USB与PC连接,期间会出现授权,是否打开USB调试等待操作选项,选择允许/打开USB调试
  • 等待一小会,device界面会显示连接成功,可以打开新URL,或进行reload,close等操作
  • 选择inspect,就能像在PC上调试一样在移动设备上调试网页了

使用Chrome(PC)调试移动设备上的网页的更多相关文章

  1. 如何通过Chrome远程调试android设备上的Web网站

    网上的帖子很多,但很多都是老版本的,试过了,根本不管用,花了一天时间,终于在本机试验通过了,特记录下来,以备用.有需要的朋友也可以参考.先上一张图,看看PC端chrome上调试的效果: 左边是手机的模 ...

  2. Fiddler:在PC和移动设备上抓取HTTPS数据包

    Fiddler是一个免费的Web调试代理,支持任何浏览器.系统以及平台.这个工具是进行Web和App网络开发的必备工具,戳此处下载. 根据Fiddler官网的描述,具有以下六大特点: Web调试 性能 ...

  3. 关于browser-sync(在多个设备上进行网页调试)的问题点总结

    最近在看响应式网站的开发视频,其中有一部分非常有用,就是在多个设备上进行网页调试,通过使用browser-sync来实现,具体的步骤可以参照官网(http://www.browsersync.cn/) ...

  4. 在本地调试移动设备上的页面——神器weinre介绍

    平时写代码,最喜欢用chrome的developer Tool调试页面了,基本是离不了的工具.但是当页面需要在移动设备上使用,尤其是被嵌入到Hybird APP中时,由于移动版的chrome没有dev ...

  5. 在桌面chrome中调试android设备中的web页面

    准备工作 1, 桌面版chrome 2, Android设备(安装有chrome浏览器) 3, Android-sdk Android-sdk安装及设置 SKD安装 从http://developer ...

  6. 在电脑上用chrome浏览器调试android手机里的网页代码时,无法看到本地加载的js文件

    在需要调试的js文件最顶部加上代码就可以看到了: console.log('haha'); debugger;

  7. 通过Mac远程调试iPhone/iPad上的网页(转)

    我们知道在 Mac/PC 上的浏览器都有 Web 检查器这类的工具(如最著名的 Firebug)对前端开发进行调试,而在 iPhone/iPad 由于限于屏幕的大小和触摸屏的使用习惯,直接对网页调试非 ...

  8. [转] 在安卓设备上使用 Chrome 远程调试功能

    你的网页内容在移动设备上的体验可能和电脑上完全不同.Chrome DevTools 提供了远程调试功能,这让你可以在安卓设备上实时调试开发的内容. 安卓远程调试支持: 在浏览器选项卡中调试网站. 在原 ...

  9. WebView 与PC机Chrome配合调试

    参考自http://www.cnblogs.com/terrylin/p/4606277.html 移动端WebView开发调试:Chrome远程调试 Chrome DevTools调试移动设备Bro ...

随机推荐

  1. codechef AUG17 T3 Greedy Candidates

    Greedy Candidates Problem Code: GCAC The placements/recruitment season is going on in various colleg ...

  2. mvc3 学习链接收集

    原文发布时间为:2011-04-17 -- 来源于本人的百度文章 [由搬家工具导入] The mvc3 study links collection http://dotnetslackers.com ...

  3. aspx生成静态页面html 例子

    原文发布时间为:2009-07-26 -- 来源于本人的百度文章 [由搬家工具导入] using System;using System.Data;using System.Configuration ...

  4. poj 3623 Best Cow Line, Gold 后缀数组 + 贪心

    题目链接 题目描述 对于一个给定的字符串,可以从左右两端取字符,依次排列构成一个新的字符串. 求可能构成的字符串中字典序 最小的一个. 例:ACDBCB -> ABCBCD 思路 参考自 xue ...

  5. linux内核情景分析之信号实现

    信号在进程间通信是异步的,每个进程的task_struct结构有一个sig指针,指向一个signal_struct结构 定义如下 struct signal_struct { atomic_t cou ...

  6. git的使用学习(六)git的标签管理

    发布一个版本时,我们通常先在版本库中打一个标签(tag),这样,就唯一确定了打标签时刻的版本.将来无论什么时候,取某个标签的版本,就是把那个打标签的时刻的历史版本取出来.所以,标签也是版本库的一个快照 ...

  7. ASP.NET MVC 利用Razor引擎生成静态页

    实现原理及步骤: 1.通过ViewEngines.Engines.FindView查找到对应的视图,如果是部分视图,则用:ViewEngines.Engines.FindPartialView: 2. ...

  8. The End Of 2016

    上半年,在意识模糊的各种考试中度过……每天都在想高考的那几天会是什么样…… 果然,高考期间身体还是出了状况.数学滚粗之后都有点不想考了==但还是坚持到了最后一门. 怎么说呢:高中三年过得不是很开心. ...

  9. [置顶] python字典和nametuple互相转换例子

    如果tuple中的元素很多的时候操作起来就比较麻烦,有可能会由于索引错误导致出错. namedtuple对象给tuple命名. 下面的例子可以字典和nametuple互相转换 aa={'verbosi ...

  10. implement-stack-using-queues(easy,但也有思考价值)

    https://leetcode.com/problems/implement-stack-using-queues/ 还有种方法,就是利用同一个队列,知道队列长度前提下,把内容从头到尾,再向尾部依次 ...