轉(zhuǎn)自：不愛(ài)吃西紅柿的魚(yú)
IOS 移動(dòng)端 （Safari開(kāi)發(fā)者工具）
手機(jī)端：設(shè)置?→ Safari →?高級(jí)?→ Web 檢查器?→?開(kāi)。
mac端：Safari →?偏好設(shè)置?→?高級(jí)?→?在菜單欄中顯示“開(kāi)發(fā)”菜單。
在 OS X 中啟動(dòng) Safari 之后，以 USB 電纜正常接入 iOS 設(shè)備，并在此移動(dòng)設(shè)備上啟動(dòng) Safari。此時(shí)點(diǎn)擊計(jì)算機(jī)上的 Safari 菜單中的“開(kāi)發(fā)”，可以看到有 iOS 設(shè)備的名稱顯示，其子菜單項(xiàng)即為移動(dòng)設(shè)備上 Safari 的所有標(biāo)簽頁(yè)，點(diǎn)擊任意一個(gè)開(kāi)始調(diào)試。
便捷，簡(jiǎn)單，還可以調(diào)試外殼包裹的瀏覽器如微信。
備注：順便提一下，要調(diào)試不同版本的ios，可以進(jìn)xcode 進(jìn)行下載不同的系統(tǒng)包（當(dāng)然是在沒(méi)有設(shè)備的情況下，土豪略過(guò)）
chrome 調(diào)試方法
首先確保手機(jī)上和PC機(jī)上裝有最新版本的chrome瀏覽器，其次是將手機(jī)的開(kāi)發(fā)者選項(xiàng)打開(kāi)并允許調(diào)試，然后將數(shù)據(jù)線將兩臺(tái)設(shè)備連接起來(lái)。在PC機(jī)上打開(kāi)chorme，輸入chrome://inspect?，然后在手機(jī)上打開(kāi)chrome，然后手機(jī)會(huì)彈框詢問(wèn)是否允許調(diào)試，當(dāng)然確定啦。有時(shí)候手機(jī)鎖屏?xí)嚅_(kāi)，請(qǐng)拔掉usb重來(lái)。
點(diǎn)擊inspect打開(kāi)DevTools后，你可以選中頁(yè)面中的DOM元素，同時(shí)設(shè)備中對(duì)應(yīng)元素也高亮顯示，也可使用DevTools中的Inspect Element 選中目標(biāo)元素，可以實(shí)時(shí)與移動(dòng)設(shè)備頁(yè)面交互，方便的定位問(wèn)題所在，進(jìn)行代碼調(diào)試，就能像pc端一樣愉快的玩耍了。如果有問(wèn)題，請(qǐng)檢查chrome版本。
chrome的調(diào)試一般只可以調(diào)試chrome頁(yè)面，但是其官方文檔說(shuō)還可以調(diào)試WebViews：
“On your computer, the chrome://inspect page displays every connected device, along with its open tabs and debug-enabled WebViews.”
需要說(shuō)明調(diào)試WebView需要滿足安卓系統(tǒng)版本為Android 4.4+，并且需要再你的APP內(nèi)配置相應(yīng)的代碼，在WebView類中調(diào)用靜態(tài)方法setWebContentsDebuggingEnabled，如下：
if (Build.VERSION.SDK_INT?>=Build.VERSION_CODES.KITKAT)?{
WebView.setWebContentsDebuggingEnabled(true);
}
以上配置方法適用于安卓應(yīng)用內(nèi)所有的WebView情形。
安卓WebView是否可調(diào)試并不取決于應(yīng)用中manifest的標(biāo)志變量debuggable，如果你想只在debuggable為true時(shí)候允許WebView遠(yuǎn)程調(diào)試，請(qǐng)使用以下代碼段：
if (Build.VERSION.SDK_INT>= Build.VERSION_CODES.KITKAT)?{
if (0?!=?(getApplicationInfo().flags?&=ApplicationInfo.FLAG_DEBUGGABLE{
WebView.setWebContentsDebuggingEnabled(true);
}
}
我這里只寫了個(gè)大概，如果有其他問(wèn)題或者欲查看詳細(xì)文檔，看下面鏈接（自備梯子）：
https://developer.chrome.com/devtools/docs/remote-debugging
注意：同樣的你也可以在電腦上裝安卓的虛擬機(jī)，推薦Genymotion ，一樣的，想測(cè)什么版本，就自己下rom?，當(dāng)然土豪當(dāng)我沒(méi)說(shuō)。
移動(dòng)設(shè)備在線測(cè)試
移動(dòng)端設(shè)備如此之多，小公司或者團(tuán)隊(duì)，沒(méi)有這么多資金和精力購(gòu)買如此多的測(cè)試設(shè)備進(jìn)行測(cè)試。于是就有人買了這些設(shè)備，連接起來(lái)，提供在線調(diào)試服務(wù)。
一般就是他的真實(shí)手機(jī)設(shè)備打開(kāi)，然后截屏出來(lái)供預(yù)覽。
比如：https://www.browserstack.com等，當(dāng)然一般比較卡。
