通过 Mac 远程调试 iPhone/iPad 上的网页

我们知道在 Mac/PC 上的浏览器都有 Web 检查器这类的工具(如最著名的 Firebug)对前端开发进行调试,而在 iPhone/iPad 由于限于屏幕的大小和触摸屏的使用习惯,直接对网页调试非常不方便,所以一直没有 Web 检查器这一类工具,但是 iOS 6 的发布解决了这个问题。

iOS 6 给 Safari 带来了远程的 Web 检查器工具(Remote Web Inspector),你可以通过模拟器或者真实的设备(通过 USB 连上 Mac)进行调试。下面我讲讲详细的调试过程:

1. 要进行远程调试,首先要打开开启 iPhone/iPad 上的 Safari 的远程调试功能,“通过 设置 > Safari > 高级”开启:



2. 然后打开 Safari,开启你要调试的网页,当然原生应用中通过 WebView 开启的网页也是可以调试的。

3. 最后把 iPhone 或者 iPad 通过数据线连上 Mac 电脑,打开桌面版的 Safari(目前 iOS 6 的 Safari 远程调试只支持通过 Mac 上的桌面版的 Safari 进行,Safari for Windows 目前还没有此项功能),点击开发菜单,选择你调试的 iPhone/iPad 的设备名,选择调试的网页。



4. 最后就是调用桌面版的 Safari 的 Web 检查器对 iPhone/iPad 上的 Safari 应用进行调试:



这个调试过程和我们平常在 Mac/PC 上调试基本一样,比如可以对 HTML 和 CSS 做些实时的改动,查看修改后的效果。查看 cookie,本地存储,session 等一些数据。查看 WebApp 的性能,网络请求等,也可以查看所有错误和警告信息对程序进行修正。

当然我们可以通过它来调试 Javascript,设置断点,定义未捕获的意外等。也可以访问 Console,直接执行 Javascript 代码。

另外它还支持触摸检查(Touch to inspect):激活检查器上的手型图标,就可以通过在 iPhone/iPad 上触摸,就能立即找到检查器对应的 DOM 元素。

(0)

相关推荐

  • 已购项目不在此iPhone/ipad上如何删除

    当我在用iPhone或是ipad在App Store下载了一些应用后,我们发现在已购项目中就会展示出来,一个两个还好,长时间积累下来就会让很多人都想要删除它,那么下面我来说下已购项目不在此iPhone ...

  • 这么做就能在iPhone/iPad上看电脑里的视频了

    操作方法 01 对于果粉而言,用iPhone.iPad随时随地看电影无疑是一件灰常惬意的事,可这些装备上只能通过PPS影音.优酷等客户端下载,里面的内容实在是有限,很多大片都无法在第一时间更新,在这里 ...

  • Mac如何找回iphone手机上被删除的微信记录

    Mac怎么找回被删除的微信聊天记录?一朋友前几天接了一大单子,熬了两个通宵总算是搞定了,但是前天他准备把自己手机里的微信聊天记录导出来的时候,发现聊天记录没了!这可把他吓坏了,回想起来可能是之前自己太 ...

  • 苹果iphone(ipad)上的小圆点(辅助触控)怎么打开

    苹果iphone手机(ipad)有一个小圆点功能以前这个小圆点叫做Assistive Touch,现在新的IOS系统该小圆点功能叫做"辅助触控",开启这个功能,它能帮助我们大大的减 ...

  • 远程!怎样在 iPad 里免费用上Windows 7的方法

    我发现自己有个怪喜好,很久以前,我只有一台Windows PC,我会想尽方法在Windows上使用Mac (桌面主题、模拟器等方法);到我同时拥有Windows及Mac时,我又想办法在Mac上跑Win ...

  • 如何删除和恢复iPhone和iPad上的照片和视频

    iPhone和iPad上都有数百张照片,如果你有太多的照片凌乱你的iPhone存储或只是想摆脱那些你永远不会再看的照片,那么这里是如何摆脱他们的! 如何删除已删除的照片,以防万一您不小心删除了您实际想 ...

  • 如何解决IPhone下载软件也会在IPad上下载问题

    同时拥有IPad和IPhone的童鞋们,可能会遇到这样一个问题,在IPad和IPhone上使用同一个AppleId时,一个设备上下载软件,另一个设备也会进行下载,那如何将此功能关闭呢? IPhone关 ...

  • iPhone/iPad版PPTV多屏体验

    这里简单介绍一下如何使用 iPhone/iPad 版PPTV多屏控制的方法。可以通过 iPhone/iPad 上的PPTV 在 PC 端的 PPTV 上进行在线视频播放,就好比把 iPhone/iPa ...

  • 亲测有效 | iphone/ipad如何播放无损音乐

    常见的无损音乐有WAV.WMA.APE.FLAC等几种格式,但iphone/ipad并不完全支持所有格式,比如ape格式.网上提供的解决方法不尽人意,如"酷我音乐"现已不支持文件导 ...