查了很多資料，嘗試了大部分方法，下面將這一天的努力總結(jié)下分享給大家，也讓大家免去看那么多文章，以下介紹的方法，都是本人親自測試成功的方法，測試環(huán)境winxp。

一、Chrome*瀏覽器

chrome模擬手機總共有四種方法，原理都一樣，通過偽裝User-Agent，將瀏覽器模擬成Android設(shè)備。以下標(biāo)星的為推薦方法。

1.新建Chrome快捷方式

右擊桌面上的Chrome瀏覽器圖標(biāo)，在彈出的右鍵菜單中選擇“復(fù)制”，復(fù)制一個圖標(biāo)副本到桌面。右擊該副本，選擇“屬性”，打開相應(yīng)的對話框，在“目標(biāo)”文本框的字符后面添加以下語句：“–user-agent=”Android””，如下圖：

注意user前面是兩個“-”，并且“chrome.exe”與“–user”之間有一個空格。確定之后，打開這個新建的Chrome快捷方式，輸入3g.qq.com就可以瀏覽到像手機里打開一樣的頁面了。

這時可以新建一個用戶，就不影響原來用戶訪問的時候也是訪問的手機版。

2.一次性模擬iPhone和安卓手機

開始–運行中輸入以下命令，啟動瀏覽器：

模擬谷歌Android：

chrome.exe --user-agent="Mozilla/5.0 (Linux; U; Android 2.2; en-us; Nexus One Build/FRF91) AppleWebKit/533.1 (KHTML, like Gecko) Version/4.0 Mobile Safari/533.1"

模擬蘋果iPhone：

chrome.exe --user-agent="Mozilla/5.0 (iPad; U; CPU OS 3_2_2 like Mac OS X; en-us) AppleWebKit/531.21.10 (KHTML, like Gecko) Version/4.0.4 Mobile/7B500 Safari/531.21.10"

這種方法僅供特殊情況下使用，因為重啟Chrome將不能恢復(fù)正常User-Agent，所以是一次性。

更多的user-agent請自行搜索。

3.安裝插件

插件可以很方便切換各種user-agent，很方便，但是可能會稍微影像性能。

User-Agent Selector地址：https://chrome.google.com/webstore/detail/user-agent-selector/fnbmdojpgjpmjjmnjdnbobcdhenmmgod/related

從上圖可以看到，還有很多類似的插件，其實功能都大同小異。

4：自帶模擬器*

打開chrome開發(fā)者工具，按F12（r32版本），然后找到右上角的齒輪按鈕，打開設(shè)置面板，選擇Overrides，勾上Show ‘Emulation’ view in console drawer（在控制臺視圖中顯示“仿真”）。

然后關(guān)閉設(shè)置面板，選擇Elements面板（非Console就可以），找到右上角打開控制臺面板，選擇控制臺面板里的Emulation面板，右邊有很多選項，選擇一個點擊Emulate就可以了，Reset按鈕能恢復(fù)到默認狀態(tài)。

打開仿真后，打開http://xw.qq.com，即可看到如下的手機下的界面

這種方法簡單好用，而且不需要重啟，推薦這種方法。

注意：以上第一種和第二種方法都需要將全部打開的chrome窗口關(guān)閉，再打開才能起作用。

二、Firefox*瀏覽器

1.修改user-agent

和chrome一樣安裝插件修改user-agent的方法，搜索wmlbrowser、XHTML Mobile Profile以及User Agent Switcher三個插件

2.火狐響應(yīng)式設(shè)計+修改user-agent*

最近的火狐自己添加響應(yīng)式設(shè)計功能和3D試圖都很棒，打開火狐自己的控制臺（非firebug），找到右上角的響應(yīng)式設(shè)計按鈕。

打開后即切換到響應(yīng)式設(shè)計界面

但我們看到打開QQ的站點并未被自動引到QQ的移動頁面，這樣只對響應(yīng)式設(shè)計的界面起作用，對想QQ這樣云端判斷，返回不同頁面的并不適應(yīng)，這里就要配合上面的方法，再改下user-agent，即可實現(xiàn)類似chrome的調(diào)試功能。

3.Firefox OS 模擬器

安裝的方法 參考這里：https://developer.mozilla.org/zh-CN/docs/Tools-840092-dup/Firefox_OS_%E6%A8%A1%E6%8B%9F%E5%99%A8#Installing

安裝完成后可打開如下界面，可用里面的瀏覽器打開網(wǎng)站即可，但這種方法打開的是電腦網(wǎng)站，而不是手機網(wǎng)站，也就是他的user-agent不是手機的，故對響應(yīng)式界面起作用，對判斷user-agent的網(wǎng)站不起作用，訪問qq，baidu等返回的都是電腦界面。

三、Opera*瀏覽1.修改user-agent

和chrome和firefox類似，可自行安裝插件，自opera12之后，opera改用webkit內(nèi)核，故可安裝chrome的插件，也可自行在opera的商店中搜索插件

User Agent Changer下載： https://addons.opera.com/zh-cn/extensions/details/user-agent-changer/?display=en

2.Opera Mobile Emulator + dragonfly*

下載適合自己的版本，安裝完畢會開如下界面：

左側(cè)選擇平臺，右側(cè)選擇參數(shù)，選擇完畢點擊啟動，如下的幾面，用過手機opera的朋友會很熟悉，就是手機opera

關(guān)于opera mobile emulator的更詳細介紹參看文章末尾參考資料的相關(guān)內(nèi)容。

但此時，還是只能看而已，不能調(diào)試模擬器里的網(wǎng)站，這里需要dragonfly配合以實現(xiàn)調(diào)試，由于opera12后換了內(nèi)核，不能安裝dragonfly了，所有你需要一款opera12的瀏覽器，和dragonfly的離線包，配置好后具體如何連接請參看這里http://www.opera.com/dragonfly/documentation/remote/

全部設(shè)置好后即可實現(xiàn)在電腦上調(diào)試手機網(wǎng)頁，如下圖所示：

opera mobile emulator下載地址：http://www.opera.com/zh-cn/developer/mobile-emulator

四、模擬器*
1.官方模擬器*

做安卓開發(fā)的肯定都知道安卓模擬器，這是谷歌官方的提供的開發(fā)環(huán)境，能模擬安卓環(huán)境，還可切換各個版本，可下載配置好的環(huán)境，然后打開eclipes，直接打開AVDM，穿件一個AVD，然后start，如下圖：

要等一大會時間，會打開模擬器，和安卓環(huán)境一樣，打開里面的瀏覽器測試即可。但我的瀏覽器打不開不知道為什么，郁悶的很啊。

下載地址：http://developer.android.com/sdk/index.html

2.bluestacks

這也是一款模擬器，可自行搜索，本人安裝后電腦就卡死了，可能我的電腦配置不行吧，看介紹還是不錯的。

五、在線測試

在線只能測試界面的視覺效果，不能調(diào)試，但也是很不錯的。

1.Mobile Emulator*

非常不錯，速度也很快，界面很簡潔，支持多種平臺。

http://emulator.mobilewebsitesubmit.com/

2.opera mini simulator

需要java環(huán)境支持，單一平臺，opera出品，速度很快。

http://www.opera.com/zh-cn/developer/opera-mini-simulator

3.webpage mobile

說實話弄了半天也沒弄出來，大大的鄙視下吧，但是能測試的平臺很全面。

http://www.webpagetest.org/mobile

六、總結(jié)

以上列出了多種方法，各有利弊，希望大家選擇適合自己的方法，本人推薦chrome自帶模擬器和opera mobile emulator + dragonfly的方法。因為這兩種方法，接近真是手機環(huán)境，又能調(diào)試css和js。

當(dāng)然文中沒有提到的還有最好的方法就是你有一臺手機，那就太好了，配合遠程調(diào)試，是最最理想的辦法。

總結(jié)

以上是生活随笔為你收集整理的在PC上测试移动端网站和模拟手机浏览器的5大方法的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。