相較於pc端，移動端除錯要更加豐富一些，下面對除錯的方法進行簡單彙總。
主要分為以下幾點:
chrome developer tools
android+chrome inspect
ios+safari
gapdebug
weinre
weinre相關套件
**除了chrome，firefox中的除錯工具也較為類似，firefox有個小優勢就是**工具charles支援直接開啟firefox的**服務（需要安裝firefox的charles外掛程式）。
特點除錯簡單，進行響應式布局、效能優化、網路環境模擬等比較方便，缺點是非真機無法除錯webviewjsbridge及發現真機中存在的問題。
適用範圍
頁面響應式除錯，適合開發初始階段，還可進行效能優化分析，前端開發乃至後端開發人員必備技能。
特點使用chrome inspect除錯android裝置（包括模擬器）中的網頁，訪問chrome://inspect
即可看到連線裝置以及可除錯頁面。
初次使用chrome inspect需要翻牆
特點使用pc端的safari除錯ios裝置中的網頁，可進行真機遠端除錯，也可除錯模擬器。
適用範圍
除錯ios裝置（包括模擬器）上的webview及safari中的網頁。
如果除錯safari，直接開啟模擬器，使用pc中的safari就可識別到除錯網頁，而除錯webview，則需要安裝debug包（由於是執行在pc上，需x86打包）。
簡單步驟如下：
安裝xcode命令列工具 xcode-select --install
建立模擬器 xcrun simctl create "demo"
啟動模擬器 xcrun instruments -w 'demo'
特點跨平台，應用是個web頁面，同時整合了safari和chrome的除錯工具，可執行在windows和mac平台上
適用範圍
ios裝置和4.4以上版本android裝置（及其模擬器）上的webview和網頁。
特點適用範圍廣，在除錯頁面中載入weinre提供的乙個js指令碼，即可在weinre inspect面板中進行除錯。
安裝步驟如下（npm安裝方式）：
安裝 npm install -g weinre
啟動 weinre --boundhost -all-
，預設埠是8080，可新增配置--httpport 8888
改變埠為8888
配置指令碼 訪問http://localhost:8080
，將target script加入到除錯頁面中
詳細配置及其它安裝方式可參見官方文件
與第4點類似提供裝置中的開發者工具顯示，還有eruda，可以訪問檢視效果。
spy-debugger是weinre的擴充套件版，執行
npm install spy-debugger -g通過**攔截html自動注入所需除錯指令碼
整合了**功能，預設使用anyproxy，也可配置其他**
支援https，可攔截webview及瀏覽器發起的請求
以上涉及移動端裝置（包括模擬器）的除錯方式均可配合**一同使用，在移動端裝置中配置http/https**，將線上資源**到本地，使改動即時生效並看到效果。
常用的**工具主要有fiddle和charles，**工具上提供的功能很多，但除錯過程中的開啟方式一般有以下兩種：
直接設定裝置的**伺服器為本機，截獲請求查詢資料，排查異常資訊，屬於問題定位階段
除了設定**伺服器，另外配置一些資源的**路徑為本地資源，實時檢視**運**況，屬於問題解決階段， 平時開發過程也可用該方法**線上資源進行除錯
上面對各類除錯方法進行了大致介紹，每個方法都有各自的特點和適用場景。
響應式除錯中，使用chrome devtools即可快速檢視多裝置顯示效果和實時調節，另外還有ghostlab也是響應式除錯的好工具，有著和broswer-sync一樣的多裝置多視窗同步功能；
進一步的真機(模擬器)除錯，高版本android裝置配合chrome，ios裝置配合safari，使用gapdebug則更為方便，統一了ios和android裝置的除錯入口;
而其它無法使用chrome和safari進行除錯的情況，比如一些低端機型的相容問題，使用weinre或其相關套件進行除錯；
再配合**的資源本地對映，能夠更為方便地除錯線上環境出現的問題；
實際開發中，還是需要在合適的時機選擇合適的除錯方式。
H5App 美麗天氣
分別對應春夏秋冬。背景的實現依靠了兩個div，html如下 class weather cover div class weather content div 其中，cover是季節桌布 準備了春夏秋冬四張 其css如下 weather cover weather cover spring weat...
H5 app前端後台ajax互動總結
流應用開發 1.前端是hbuilder 編寫的html頁面，ui控制項用mui 2.後台用eclipse開發的servlet做控制器 3.前後臺互動用mui的ajax。在hbuilder中選擇在安卓手機 我的手機是安卓的 執行編寫好的移動應用，前端寫好登陸頁面 後台使用eclipse編寫，採用mvc...
H5及H5 app對iphoneX及以上適配
本文主要介紹對iphonex及以上適配。提供css和js的適配方式。一 設定網頁在可視視窗的布局方式注 viewport fit cover使得頁面內容完全覆蓋整個視窗 二 頁面主體內容限定在安全區域內body注 只有設定了viewport fit cover，才能使用env env 跟consta...