打开开发者工具,进入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. Mac017--Jenkins 持续集成

    Jenkins 是一个开源项目,提供了一种易于使用的持续集成系统,使开发者从繁杂的集成中解脱出来,专注于更为重要的业务逻辑实现上.同时 Jenkins 能实施监控集成中存在的错误,提供详细的日志文件和 ...

  2. 什么是HIS、PACS、LIS、RIS

    什么是HIS?医院信息系统的定义(HIS)医院信息系统(Hospital Information System,HIS)在国际学术界已公认为新兴的医学信息学(Medical Informatics)的 ...

  3. Redis功能迅速回忆

  4. e.target与e.currentTarget的区别,事件冒泡与事件捕获 ,事件委托

    e.target与e.currentTarget的区别:https://www.jianshu.com/p/1dd668ccc97a 事件冒泡与事件捕获 :https://www.jianshu.co ...

  5. 扩展欧几里得算法详解(exgcd)

    一.前言 本博客适合已经学会欧几里得算法的人食用~~~ 二.扩展欧几里得算法 为了更好的理解扩展欧几里得算法,首先你要知道一个叫做贝祖定理的玄学定理: 即如果a.b是整数,那么一定存在整数x.y使得$ ...

  6. 回溯---IP 地址划分

    IP 地址划分 93. Restore IP Addresses(Medium) Given "25525511135", return ["255.255.11.135 ...

  7. Elasticsearch7.X 入门学习第三课笔记----search api学习(URI Search)

    原文:Elasticsearch7.X 入门学习第三课笔记----search api学习(URI Search) 版权声明:本文为博主原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出 ...

  8. 多个nginx之间如何实现反向代理和负责均衡

    1)nginx反向代理: http {     upstream routeadmin {         ip_hash;         server 127.0.0.1:9201 weight= ...

  9. asp.net webapi自定义输出结果类似Response.Write()

    asp.net webapi自定义输出结果类似Response.Write()   [HttpGet] public HttpResponseMessage HelloWorld() { string ...

  10. pg_config - 检索已安装版本的 PostgreSQL 的信息

    SYNOPSIS pg_config {--bindir | --includedir | --includedir-server | --libdir | --pkglibdir | --confi ...