二、断点详解

本文详细讲解了WEB代码运行时间轴中的各种断点类型,包括DOM断点、DOM事件断点、XHR断点、全局事件断点和异常捕获断点。通过设置这些断点,可以有效地定位代码执行流程,特别是在处理加密函数和与服务器交互时。DOM断点在元素变化时触发,而DOM事件断点则在特定DOM事件发生时暂停。XHR断点在发送请求时生效,有利于分析数据交互。全局事件断点用于捕获浏览器事件,异常捕获断点则用于调试异常处理逻辑。
摘要由CSDN通过智能技术生成

WEB代码运行时间轴

  1. 加载html代码-css-js
  2. 运行js初始化
  3. 用户操作(触发某个事件)
  4. 调用了某段js
  5. 加密函数
  6. 给服务器发信息
    1. 创建XHR对象,XHR-SEND
    2. 接收到服务器数据
    3. 解密函数
    4. 刷新网页渲染
  • DOM断点
  • DOM事件断点
  • XHR断点(发包断点)
  • 代码行断点 (手动下断点)
  • 源码 debugger
  • 全局事件断点(浏览器事件断点)
  • 异常捕获断点

DOM断点-3

重新选然后,属性发生改变或者样子发生改变才能断住

定位比较准

之前比较靠前,距离加密函数比较远,我们无法根据栈去快速定位

在这里插入图片描述

在这里插入图片描述

DOM事件断点-3

如果DOM断点不能下断,就可以用DOM事件断点,和DOM断点特性一致

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值