开启掘金成长之旅！这是我参与「掘金日新计划 · 12 月更文挑战」的第2天，点击查看活动详情
打开调试器
通过F12或者鼠标右键选择检查可进入调试页面，通过点击左上角箭头可选中想调试的元素
Elements
Styles
通过styles选项卡可以查看应用在该元素上的样式，点击:hov 可以选择该元素在不同状态下所被应用的样式，点击.cls可查看和编辑应用在该元素上的类
Event Listeners
通过该选项卡能查看被选中元素上的所有事件，并可以进入到该事件的源码位置
DOM Breakpoints
选中元素->右键->Break On 可以监听该元素属性变化/子元素变化/节点移除 并在DOM Breakpoints中看到断点
console 调试面板以及常用函数
console面板允许我们直接调试程序或将代码中的一些调试信息输出
console.log
通过console.log可以在代码里打印出想要的输出信息，并在控制台查看
console.table
console.table可以将对象信息转化成表格，如
console.group / console.groupCollapsed console.groupEnd
当想调试定时器等类似多次重复运行的函数时，可时候该函数，此函数会将调试信息分组，如
console.groupCollapsed 默认不展开分组
console.dir(dom) 将DOM对象转成 Object
console.time 可通过该方法去计算某函数运行时间,如
console.count 有时候想要知道一个方法在一个运行周期执行了几次，可借助该函数，如
可知道该InterVal一共执行了6次。 console.countReset('testCount')可重置该计时器
console.trace 打印堆栈信息，如
此处调用了c，通过堆栈信息可看出是通过b调用了a
