Chrome模拟器
h5页面在chrome浏览器打开， 在打开开发者模式下进行调试。 chrome详细调试功能可参考
- 直接鼠标 右击选择检查打开。或者 右上角三个点 > 更多工具 > 开发者工具
2. 在上图法人1 ，点击可切换手机型号.点击 edit 可编辑自定义模拟手机场景，比如，设置大小没,设置 user agent
安卓设备的H5页面
- 直接访问h5 页面，若是原生app内嵌的h5页面，需要将 WebViews 配置为可调试状态 。
- 开启当前Android设备的开发者模式： 不同设备长厂商具体分析，小米手机： product.pconline.com.cn/itbk/sjtx/s…
- ：打开
Android手机设置>开发者选项>USB调试
4. 电脑打开chrome浏览器 ，并打开 chrome://inspect/#devices， 勾选界面中的 Discover USB devices
5. 用USB线连接Android设备，允许usb 调试，传输文件
7. 在chrome 页面上炸弹此设备，在下面的页面列表（将展示已在Android上的chrome中打开的页面），点击对应的 inspect 开始调试。
IOS调试
- 在iOS设备上打开允许调试（iPhone开启Web检查器）：设置→Safari→高级→打开”web检查器“。
2. 在MAC上打开Safari浏览器的开发菜单：顶部菜单栏“Safari”→偏好设置→高级→打开”在菜单栏中显示“开发”菜单。
3. 在iOS设备上的Safari浏览器中打开要调试的页面，用数据线链接MAC, 然后切换到MAC的Safari，在顶部菜单栏选择“开发”→找到你的iOS设备名称→右边二级菜单选择需要调试的对应标签页，即可开始远程调试。
5. 如果没有iOS设备，也可以在Xcode中模拟一台，点击顶部“Xcode”→“Open Developer Tool”→“iOS Simulator”即可打开一个iOS设备的模拟器，并且模拟器里面Safari打开的页面，也是能通过上个步骤中MAC上的Safari调试。
注：若是原生app内嵌的h5页面，必须是debug状态的包才能使用Safari调试。
微信相关调试
1.在微信开发者工具打开相应页面进行调试
vConsole
h5 页面也可以开启 vConsole 查看信息
腾讯出品的 Web 调试面板，相信不少前端小伙伴都用过。vConsole 会在你网页中加一个悬浮的小按钮，可以点击它来打开关闭调试面板，并查看 DOM、Console、Network和 本地存储 等信息。基本可以满足普通前端开发的需求。使用方法也很简单，通过npm安装或者直接在需要的页面引入 js文件 ，然后 new VConsole() 就可以了。
使用可参考： blog.51cto.com/u_12390904/…
eruda
开启掘金成长之旅！这是我参与「掘金日新计划 · 2 月更文挑战」的第 1 天，点击查看活动详情
