console 控制台一些用法

1. 选择 DOM 元素
Chrome 控制台可以直接像使用 jQuery 一样,用 $ 符选择元素:如 $('.class')$('#id') 等。

2. 将浏览器转换为编辑器

document.body.contentEditable = true

可编辑文本

3. 查找与DOM中的元素关联的事件

getEventListeners($(‘selector’))

返回一个对象数组,其中包含绑定到该元素的所有事件。
要找到特定事件的侦听器:

getEventListeners($(‘selector’)).eventName[0].listener

4. 监控事件

  • monitorEvents($(‘selector’)) 将监视与选择器的元素关联的所有事件,然后在它们被触发时将它们打印到控制台。例如,monitore($(#firstName)) 将打印 ID 为 firstName 元素的所有事件。
  • monitorEvents($(‘selector’),’eventName’) 将打印与元素绑定的特定事件。 你可以将事件名称作为参数传递给函数。 这将仅记录绑定到特定元素的特定事件。 例如,monitorEvents($(‘#firstName’),’click’) 将打印绑定到ID为'firstName' 的元素的所有 click 事件。
  • monitore($(selector),[eventName1, eventName3', .]) 将根据需求记录多个事件。与其传递单个事件名作为参数,不如传递包含所有事件的字符串数组。例如 monitore($(#firstName),[click, focus]) 将记录与 ID firstName元素绑定的 click 事件和 focus 事件。
  • unmonitorevent ($(selector)) :这将停止监视和打印控制台中的事件。

参考:
灵活使用 console 让 js 调试更简单

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容