Chrome调试技巧有哪些？
一、如何查看dom元素的事件
某种情况我们在页面交互上发现一个问题，肯定是非常想知道这个交互触发执行的入口shenzhen.offcn.com，这会使我们更直接、快速的进行代码的跟踪、调试和分析。其实在chrome浏览器这很简单就实现了，如下 百度一下 按钮 监听的事件列表：
如图，我们就可以很清楚的看出 百度一下 这个按钮会触发多少的事件。
二、如何查看Javascipt的调用堆栈信息
此方法让你很快的找到ajax请求的调用堆栈，也就是ajax是在什么方法里面请求的。他的父级调用者又是谁：
如上图，我们鼠标悬停在network面板的请求上的Initiator列，就可以看到调用堆栈信息了。你还可单击某个位置进行代码的查看，这是不是很方便啊。
三、如何在线js映射到本进行调试
在这种情况下，我们大多数时间是使用Fiddler这类抓包工具进行路径的映射，或者是修改host文件进行域名的跳转。这次我向大家介绍一款chrome的插件，方便且功能强大。
插件名为：ReRes
3.1 安装和测试
ReRes的安装
下载获取插件的压缩包，然后解压，直接安装为chrome的插件：
定要开启 允许访问文件网址
ReRes添加规则
可以chrome的插件区域上单击ReRes图标，添加规则
辑http与file的对应关系，注意，一般情况下线上js都有版本的后缀，所以用最近加一个*来表示匹配，然后我们访问constinfo.js，就会跳转映射到本地的constinfo.js(这是不是很方便了)
来自 “ ITPUB博客 ” ，链接：https://blog.itpub.net/31543790/viewspace-2156649/ ，如需转载，请注明出处，否则将追究法律责任。
