HTML5页面开发进行真机调试之 Safari

• 近年来，随着 CSS3 、HTML5 和 ES6 的飞速发展，前端地位已经发生了翻天覆地的变化。其中最为突出的是 HTML5 页面的广泛使用。目前将近 80% 的 App 都有引入 HTML5 页面。因此，掌握一个好的调试方法是提供一个优美的 HTML5 页面的关键因素。此外，在日趋现代化的 Web 网络中，各种现代浏览器和移动终端设备的用户百分比越来越高。对于我们 Web 前端开发者来说，运行 iOS Safari 浏览器的苹果移动设备对我们来说更是不容忽视的。然而当我们需要对前端页面进行测试调试时，桌面版 Safari 的表现并不是与移动版 Safari 一模一样的，因此我们只能直接在 iOS 设备上对 Safari 进行测试与调试。本文将介绍如何使用 Safari 在 iPhone 上来进行 HTML5 页面的开发调试。

Step 1：打开 Safari 的偏好设置

Step 2：设置 Safari 菜单显示开发选项

Step 3：设置 Safari 自动显示JSContent的网页检查器

Step 4：设置 iphone 的 Safari浏览器的 JavaScript 和 Web检查器

Step 5：在 iphone 的 Safari浏览器打开要测试的网址

Step 6：在 PC 版 Safari 的开发菜单上点击连接的手机的 ip

Step 7：在弹出框的窗口进行页面调试（一）

Step 8：在弹出框的窗口进行页面调试（二）

转载于:https://my.oschina.net/mayxu/blog/1593116