在现代化的Web网络中，各种现代浏览器和移动终端设备的用户数量在增加。 对于我们的Web前端开发人员来说，运行iOS Safari浏览器的苹果移动设备对我们来说更是不容忽视。 但是，如果需要测试调试前端页面，桌面版的Safari不会像移动版的Safari一样工作(主要原因是设备宽度在CSS上的判断)，因此直接在iOS设备上测试Safari
本文主要介绍苹果官方提供的iOS设备上Safari浏览器前端调试解决方案的详细操作方法。 笔者采用了在iOS 6.0.1上运行的移动版Safari和在OS X Mountain Lion上运行的桌面版Safari (windows版safari暂时不具备此功能)。 理论上，这也适用于苹果移动设备(如iPhone、iTouch和iPad )上的移动版Safari浏览器。
在设定中打开功能
【iOS终端】:设置 Safari 高级网络检查器打开。 (如图所示)
【OS X】: Safari 首选项高级设置菜单栏显示“开发”菜单。 (如图所示)
连接移动设备和计算机并启用调试器
在OS X上启动Safari后，使用USB电缆成功访问iOS设备，然后在此移动设备上启动Safari。 此时，单击计算机Safari菜单中的“开发”，将显示iOS设备的名称。 其子菜单项是移动设备上Safari的所有选项卡。 单击其中一个开始调试。 (如图所示)
与使用桌面操作系统中的Safari进行调试器一样，此调试器可以在调试中显示和立即编辑HTML元素、CSS和框模型、JavaScript调试器、web元素时间轴以及DOM元素查看器等各种功能(如图所示)
HTML结构和相应的CSS :
同步iPhone截图：
HTML结构和相应的CSS实时编辑：
同步iPhone截图：
JavaScript即时调试：
同步iPhone截图：
网络请求时间线：