JS 的 6 种打断点的方式,你用过几种?(1),web前端CSS全局样式

本文介绍了JavaScript的六种断点设置方法,包括DOM断点、URL断点、Event Listener断点、异常断点,以及VSCode中的普通和条件断点。通过这些断点方式,开发者能更有效地调试前端代码,提高开发效率。
摘要由CSDN通过智能技术生成

a3d14c7b9b7bdbbd877bf35b50370b63.png

DOM 断点

在 Chrome Devtools 的 Elements 面板的对应元素上右键,选择 break on,可以添加一个 dom 断点,也就是当子树有变动、属性有变动、节点移除这三种情况的时候会断住。可以用来调试导致 dom 变化的代码。

a49738caf74470dffd50cc0d372bebb7.png 8de8601ea1fa78d37ca496aaf574d2be.png

因为是涉及到 DOM 的调试,只有 Chrome Devtools 支持这种断点。

URL 断点

在 Chrome Devtools 的 Sources 面板可以添加 XHR 的 url 断点,当 ajax 请求对应 url 时就会断住,可以用来调试请求相关的代码。

fd1d3baf181517c07ffa4d161eb38c2a.png

这个功能只有 Chrome Devtools 有。

Event Listener 断点

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值