1. 测试效果图：
test.png
本次测试所用设备相关版本信息
-
Windows 10 + chrome 110.0.5481.100
pc chrome version.png
-
Android 12 + chrome 110.0.5481.65
android version.png
2. 工具准备
- PC端、手机端同时安装chrome（两端的chrome版本最好保持一致）
- USB 连接线（手机充电线）
3. 手机开启调试模式
- 打开开发者模式：手机设置中找到手机的系统版本号，连击3次或更多次（开启成功时会弹出相关成功提示，如：您正处于开发者模式）
-
打开USB调试：手机设置中找到【开发者人员选项】（可能有的手机必须打开了开发者模式才能找到开发者人员选项）
image.png
-
4. PC端chrome查找 USB 设备
浏览器访问chrome://inspect/#devices，勾选Discover USB devices
image.png
5. 调试
手机端chrome浏览器访问需要调试的页面，chrome://inspect/#devices上会展示出对应选项
image.png
针对需要调试的页面，点击下方的
inspect链接打开对应页面的Devtools，这样就能查看和调试页面在移动端的效果了注意： 两端chrome版本不一致时inspect打开的Devtools可能无法正常显示，可根据提示点击
inspect fallback选项可打开页面正常显示
网友评论