介紹一個前端頁面開發必備神器,chrome擴展,設備模擬器

有了這個擴展,我們無需手動打開Chrome開發者工具去模擬設備了:


在Chrome web store裡搜索關鍵字設備模擬器:

介紹一個前端頁面開發必備神器,chrome擴展,設備模擬器

安裝之後,點擊Chrome工具欄裡的黃色圖標打開User-Agent的下拉選項:

介紹一個前端頁面開發必備神器,chrome擴展,設備模擬器

之後就會用選中的user-agent重新請求網頁了。


下圖是我在筆記本電腦上用小米手機對應的user-agent去打開知乎網站的一個例子,可以看到屏幕下方出現了原本只有在移動設備上才能看到的提示:App內打開

介紹一個前端頁面開發必備神器,chrome擴展,設備模擬器

而正常的PC端瀏覽這個網頁,如下圖,是不會出現這個按鈕的:

介紹一個前端頁面開發必備神器,chrome擴展,設備模擬器

不光能選擇移動設備對應的User-Agent,還能選擇模擬各種類型的瀏覽器,比如360瀏覽器,獵豹瀏覽器等。

介紹一個前端頁面開發必備神器,chrome擴展,設備模擬器

IE,firebox當然更沒有問題。

介紹一個前端頁面開發必備神器,chrome擴展,設備模擬器


介紹一個前端頁面開發必備神器,chrome擴展,設備模擬器


分享到:


相關文章: