打开开发者工具，进入chrome调试状态，点击左上角的手机图标，进入手机模拟器调试状态。

模拟器支持操作：

切换设备类型，模拟网络环境，模拟bar,keyboard弹出状态，横屏状态，更改UserAgent ,设置缩放比例等等

常用debug方法：

1、在代码中添加debugger语句

2、手动添加断点

3、条件断点 右键editbreakpoint

4、事件触发断点

5、dom节点属性变化触发断点

其他调试技巧参见：https://segmentfault.com/a/1190000002654265

移动端调试 — chrome模拟器基础调试的更多相关文章

  1. Chrome浏览器如何调试移动端网页信息

    Chrome浏览器如何调试移动端网页信息 2017年08月12日 12:42:20 阅读数:835 最近在弄项目,用WebView加载一个页面,想追踪页面中一个按钮的点击事件.这个可能就需要调试这个页 ...

  2. 使用Chrome开发者工具调试Android端内网页(微信，QQ，UC，App内嵌页等)

    使用Chrome开发者工具调试Android端内网页(微信,QQ,UC,App内嵌页等) 前言 移动端页面调试一直是好多朋友头疼的问题,iOS 由于其封闭的特性和整体较高的性能,整体适配相对好做,调试 ...

  3. javascript在调试bug的奇淫技巧（Chrome, Firebug, Filddle 调试）

    Fiddler Fiddler调式使用知多少(一)深入研究 微信fiddle 微信fiddle Chrome Google Chrome 官方 Chrome - 基础 Chrome - 进阶 Chro ...

  4. 超完整的Chrome浏览器客户端调试大全

    引言 “工欲善其事,必先利其器” 没错,这句话个人觉得说的特别有道理,举个例子来说吧,厉害的化妆师都有一套非常专业的刷子,散粉刷负责定妆,眼影刷负责打眼影,各司其职,有了专业的工具才能干专业的事,这个 ...

  5. Charles学习（四）之使用Map local代理本地静态资源以及配置移动端代理在真机上调试iOS和Android客户端

    前言 问题一:我们在App内嵌H5开发的过程中,肯定会遇到一个问题就是我不想在chrome的控制台中调试也不想在模拟器中调试,我想要在真机上调试,那么如何解决这个问题呢? 问题二:我们期待调试时达到的 ...

  6. Android+Chrome 真机调试H5页面实践

    前言 使用weinre在真机上调试H5页面,有一个突出的缺点,就是无法调试真机上的样式,真机上页面动态创建的dom在weinre的Elements面板显示不出来,所以调试真机上的页面样式也就无从谈起. ...

  7. 移动前端调试方案（Android + Chrome 实现远程调试）

    一:背景 通常情况我们调试移动端页面最常用的方法就是:切换pc端浏览器的userAgent来模拟手机或其他移动设备调试页面 然后用手机打开要调试的页面 刷新页面查看调试结果 但是这就存在两个问题 在p ...

  8. chrome://inspect 移动前端调试方案（Android + Chrome 实现远程调试）

    一:背景通常情况我们调试移动端页面最常用的方法就是:切换pc端浏览器的userAgent来模拟手机或其他移动设备调试页面 然后用手机打开要调试的页面 刷新页面查看调试结果 但是这就存在两个问题 在pc ...

  9. Chrome浏览器及调试教程

    ==>(微信公众号:IT知更鸟)欢迎关注<^>@<^> Chrome浏览器及调试教程 在web开发过程中,我们在写JavaScript脚本时难免会遇到各种bug,这时,我 ...

随机推荐

  1. 解决django项目在ubuntu系统上无法安装mysqlclient

    首先我的项目是django2.0,python环境是3.5. 我们在本地开发完django项目了,在本地运行是成功的,然后我们把django项目放到服务器上,运行的时候就出错了. 如图: 我们都知道, ...

  2. MethodBase.GetCurrentMethod 方法

    如果当前正在执行的方法定义泛型类型上MethodInfo返回GetCurrentMethod通过泛型类型定义 (即,MethodInfo.ContainsGenericParameters返回true ...

  3. [19/05/18-星期六] HTML_form标签

    一.form标签(一) <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> & ...

  4. Java 异步编程

    昨天头儿给的学习文档我还没看完,头儿说:“MongoDB光会简单的添删改查什么的不行,要深入了解,你们连$set和$inc使用场景都分不清.” 确实,学习过一年多SQL,确实对学习MongoDB有点影 ...

  5. http的Content-Encoding和Content-Type及服务器和客户端处理流程

    比如,A 给 B发送了一条信息:hello,首先,A要告诉B,我给你发的这条数据的类型,不同类型的数据,接收方的处理方式不一样,hello属于文本类型,所以Content-Type就要设置成 text ...

  6. 表格类型数据，Excel csv导入，导出操作

    import pandas # 创建表格格式# ad = pandas.DataFrame({"a": range(1, 10), "b": range(10, ...

  7. 记录面试一位三年经验Web前端开发者的过程

    今天是2019年6月5日,后天就是端午节了,提前祝端午节快乐! 好了,开始这次面试过程的正题部分. 当我从人事手中接下这份三年哥(暂拟名称)的简历的时候,看到三年工作经验,心想 这应该是个大佬了 挺厉 ...

  8. vue路由的两种模式配置以及history模式下面后端如何配置

    vue路由的两种模式配置以及history模式下面后端如何配置 1.hash ——即地址栏URL中的#符号.hash 虽然出现URL中,但不会被包含在HTTP请求中,对后端完全没有影响,因此改变has ...

  9. 使用myBase Desktop来管理电脑上的资料

    下载链接:下载链接:http://www.wjjsoft.com/download.html 选择自己的操作系统下的myBase Desktop 这里是下载的是安装包,有解压的版本的. 这里就简单介绍 ...

  10. Express 2015 RC for Windows 10 安装

    支持的操作系统 Windows 10 Technical Preview 硬件要求 1.6 GHz 或更快的处理器 1 GB RAM(如果在虚拟机上运行,则为 1.5 GB) 4 GB 可用硬盘空间 ...