使用 chrome://inspect/#devices,可以使安卓手機里的WebView也能和chrome一樣審查元素,調試和測試移動端H5頁面.
我使用的是三星S6 (該功能支持安卓系統4.4及以上機型),電腦是win 7 系統,以下幾步就可以輕松使用瀏覽器內置的功能調試移動端網頁了:
1. 確保手機開啟調試模式連接電腦,手機設置里面,開發者模式、USB調試均處於開啟狀態;
2. 手機上打開一個網頁,只要是webview形式的網頁應該都是可以的;
3.電腦上安裝連接手機的驅動,cmd命令輸入:adb devices 如下圖已顯示設備信息,即代表手機已成功連接電腦;
4.電腦chrome瀏覽器地址欄輸入:chrome://inspect/#devices ,會看到如下圖的情況(上面會看到你所連接的設備的名稱和信息,下面就是當前設備上可以用於在電腦上調試的頁面的信息,地址、標題、網頁大小。。。,如果沒有顯示設備信息,則表示沒有連接好,可以插拔手機或關閉調試模式重開一下);
5.找到你准備調試的那個,並且確保手機上的那個頁面也是處於激活狀態的,然后點擊藍色的 inspect 鏈接,會彈出一個新的窗口,如下圖;
注:若出現按inspect后,發現h5頁面出不來,一直顯示空白。……需要翻牆服務(免費的推薦藍燈)
偶十月份發現安裝的藍燈突然用不了了,重新安裝了最新版本的,又可繼續用了,可以去這查看下載:https://github.com/getlantern/lantern
6.熟悉的界面出現了,接下來你應該知道怎么用了!
檢查元素↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓
控制台↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓
查看網絡情況↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓
機型適配調試↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓