第一種 調試Debug：Mobile Web調試工具Weinre
現在、將來，用移動設備上網越來越成為主流。但對於開發者們來說，移動web的調試一直是個難題，前期可以使用模擬器來協助調試，但到了真機調試階段就讓人非常頭痛。而Weinre就是解決這難題的利器。
Weinre的本意是Web Inspector Remote，它是一種遠程調試工具。功能與Firebug、Webkit inspector類似，可以幫助我們即時更改頁面元素、樣式，調試JS等，下面就簡單介紹下如何使用。下面以以Windows系統為例：
一、首先確保你的電腦已經搭建好了java環境。即：安裝了jdk。這里就不多說了，在網上搜個jdk，一步步安裝及ok。
二、安裝及運行Weinre
1、下載：http://ishare.iask.sina.com.cn/f/23607399.html ，這里直接下載jar包，下載好之后放在一個文件夾里就行不需任何處理。
2、運行cmd，在weinre所在文件夾的地址欄輸入代碼：java -jar weinre.jar --httpPort 8081 --boundHost -all- （如下圖）：
3、回車后會出現相應信息(注意：在調試過程中不要關閉cmd)：
4、打開本地瀏覽器，（使用webkit內核瀏覽器(chrome、safari)）訪問 http://localhost:8081/，不出意外的話可以看到weinre的基本信息。
5、上圖中的"debug client user interface"是weinre的Debug客戶端，點擊進入后可以看到目前還沒有被測試的目標網頁。
三、添加Debug Target
為了讓需要調試的頁面被weinre檢測到，需要添加Debug Target，有兩種方法： 1、Target Script
該方法需要在調試的頁面中增加一個js：
<script src="http://192.168.0.106:8081/target/target-script-min.js#anonymous" type="text/javascript"> </script>
添加后在移動設備中訪問該頁面即可，如果調試的頁面比較少可以使用這個方法，如果多的話推薦第二種方法
2、Target Bookmarklet 該方法是將一段js保存到移動設備的書簽中，可以在 http://localhost:8081/ 找到這段js：
javascript:(function(e){e.setAttribute("src","http://localhost:8081/target/target-script-min.js#anonymous");document.getElementsByTagName("body")[0].appendChild(e);})(document.createElement("script"));void(0);
我將這段js保存到名為Debug書簽中，然后使用移動設備訪問我想要調試的頁面，比如說 http://iinterest.net，最后點擊Debug書簽就OK了。
四、真機調試。
1、 移動設備須有有wifi無線連接，且和電腦在同一網段，（確保本機安裝了服務器，可以到網上搜xampp或wamp，）把要調試的頁面放在服務器中相應的文件夾中,我安裝的是xampp,所以放在htdocs目錄下。在手機的頁面中打開本頁面的地址，如：http://192.168.0.102/index.html 。回到http://localhost:8081頁面，點擊“debug client user interface:”鏈接進入weinre的Debug界面，如果成功添加了Debug Target，這里可以看到它。
2、接下來我們就可用自己熟悉的方式調試頁面了，並且調試結果會實時顯示在移動設備上
MAC系統更為簡單，不用命令行，直接運行app即可啟動weinre，接下來的步驟和windows一樣。
參考：http://www.iinterest.net/2012/02/08/debugging-mobile-web-applications-with-the-weinre/
第二種方法：用Opera Mobile 測試
就是根據像素來測試頁面 下載地址：http://www.opera.com/developer/tools/mobile/