如何定位＆amp;使用Chrome DevTools在网站上运行特定功能？

Question

我想知道什么在网站上运行特定的Javascript函数 - 我想使用控制台手动触发它们。

然而，有时候网站的Javascript中有很多对象 - 内部对象，我无法找到运行特定功能的内容 - 并且 - 手动触发它们。

我相信学习这一点会给我提供很多专业知识，可以调试内置网站上的某些内容，更多地了解某些内容的构建方式。

Answer 1

这是一个很小的秘诀，可能有助于开始使用开发人员工具对网站进行逆向工程。

漂亮的打印缩小代码：

能够设置断点并逐步执行代码

在已知函数处设置断点：

停止执行并能够检查右侧面板中的调用堆栈（进而隔离触发器）。

打破某个DOM事件的处理程序：

隔离正在某些交互/事件上执行的功能。

打破修改DOM的代码：

例如，添加或删除子树节点。

隔离在渲染过程中修改DOM的代码。

中断下一次执行：

如果有定期代码运行和/或您无法通过其他方法处理代码执行。

请注意，该步骤并未涵盖在网站上调试和反向工程代码的所有可能功能。其他功能例如是：XHR断点或分析器。

开发人员不断在开发工具中添加和更改功能。与他们一起玩并测试它们。

截图是调试youtube.com