我知道Chrome有一个JavaScript调试器,可以在HTML中设置断点,以便在页面加载后修改任何内容,但只能在页面已经加载后才能这样做。我正在尝试找出如何在初始页面加载时为元素分配内联样式。我尝试在文件中搜索类名,但没有结果。我不确定如何跟踪此设置的位置。查看源代码没有显示任何内联样式,因此必须来自JS文件。如何调试这个问题?
我唯一可以建议的是: 在脚本 > 脚本第一条语句上设置事件监听器断点。 重新加载页面。DevTools会暂停在执行的第一个脚本的第一行。 现在,返回到元素面板,在<body>上放置一个子树修改DOM断点。每当任何节点被修改时,DevTools都会暂停。或者,如果您的目标节点已经在HTML中声明并存在于页面上,则直接在目标节点上设置DOM断点。 不断按下恢复脚本执行,直到找到修改节点的代码行。每次按下恢复脚本执行时,脚本仅执行直到另一个节点被修改。 这样可以绕过DevTools限制DOM断点在页面加载时不起作用的问题,因为页面在设置DOM断点时已经开始运行。 尽管如此,这似乎是一个非常核心的用例。像您提到的单个节点上的DOM断点在页面加载时不起作用。DOM变异事件监听器断点也不起作用。我会提出一个功能请求来解决这个问题,无论采用哪种方式。