[密技] Chrome 內建超好用的開發工具 – 停用快取、模擬iphone/android手機、模擬觸控手勢
這篇是網路工作者(工程師、企畫、PM 等)必看的哦!都可以用 Chrome 的開發工具,不用安裝任何延伸套件(extension),是內建的工具,天然的最好!
教學、圖片說明
-
檢查網頁慢在哪裡:F12 → Network:主要是查看你的網頁慢在哪裡
-
模擬手機瀏覽器、觸控手勢:F12 → 右下角的設定 → Override User Agent → (選取你要的手機)。右下角設定 → Emulate Touch Event (打勾) 可以模擬手機/平板電腦的觸控手勢。
-
停用快取:F12 → 右下角的設定 → Disable Cache
-
檢查元素:在任何地方按滑鼠右鍵,檢查元素,可以看到 HTML 原始碼
-
查看網頁錯誤、直接寫程式:F12 → Console:可以直接執行簡單的語法。如果寫式的錯誤,也會在這邊出現。