我們知道在 Mac/PC 上的瀏覽器都有 Web 檢查器這類的工具（如最著名的 Firebug）對(duì)前端開發(fā)進(jìn)行調(diào)試，而在 iPhone/iPad 由于限于屏幕的大小和觸摸屏的使用習(xí)慣，直接對(duì)網(wǎng)頁調(diào)試非常不方便，所以一直沒有 Web 檢查器這一類工具。

但是 iOS 6 的發(fā)布解決了這個(gè)問題。

iOS 6 給 Safari 帶來了遠(yuǎn)程的 Web 檢查器工具（Remote Web Inspector），你可以通過模擬器或者真實(shí)的設(shè)備（通過 USB 連上 Mac）進(jìn)行調(diào)試。下面我講講詳細(xì)的調(diào)試過程：

1. 要進(jìn)行遠(yuǎn)程調(diào)試，首先要打開開啟 iPhone/iPad 上的 Safari 的遠(yuǎn)程調(diào)試功能，“通過 設(shè)置 > Safari > 高級(jí)”開啟：

2. 然后打開 Safari，開啟你要調(diào)試的網(wǎng)頁，當(dāng)然原生應(yīng)用中通過 WebView 開啟的網(wǎng)頁也是可以調(diào)試的。

3. 最后把 iPhone 或者 iPad 通過數(shù)據(jù)線連上 Mac 電腦，打開桌面版的 Safari（目前 iOS 6 的 Safari 遠(yuǎn)程調(diào)試只支持通過 Mac 上的桌面版的 Safari 進(jìn)行，Safari for Windows 目前還沒有此項(xiàng)功能），點(diǎn)擊開發(fā)菜單，選擇你調(diào)試的 iPhone/iPad 的設(shè)備名，選擇調(diào)試的網(wǎng)頁。

4. 最后就是調(diào)用桌面版的 Safari 的 Web 檢查器對(duì) iPhone/iPad 上的 Safari 應(yīng)用進(jìn)行調(diào)試：

這個(gè)調(diào)試過程和我們平常在 Mac/PC 上調(diào)試基本一樣，比如可以對(duì) HTML 和 CSS 做些實(shí)時(shí)的改動(dòng)，查看修改后的效果。查看 cookie，本地存儲(chǔ)，session 等一些數(shù)據(jù)。查看 WebApp 的性能，網(wǎng)絡(luò)請(qǐng)求等，也可以查看所有錯(cuò)誤和警告信息對(duì)程序進(jìn)行修正。

當(dāng)然我們可以通過它來調(diào)試 Javascript，設(shè)置斷點(diǎn)，定義未捕獲的意外等。也可以訪問 Console，直接執(zhí)行 Javascript 代碼。

另外它還支持觸摸檢查（Touch to inspect）：激活檢查器上的手型圖標(biāo)，就可以通過在 iPhone/iPad 上觸摸，就能立即找到檢查器對(duì)應(yīng)的 DOM 元素。