如何找到修改元素的JavaScript代码片段？

Question

我正在尝试检查<input type="hidden" name="Foo" value="123 />的页面在页面上有一个隐藏元素,其中Javascript/AJAX修改了该值.我试图找到Javascript中的地方,是不时修改此值的代码.

有没有一个工具可以帮助我找到使用/修改该元素的javascript中的位置？如果是这样,Firebug会提供这个吗？

注意:如果尝试在代码中查找"Foo",但我没有找到任何匹配的标题.加载了JSON和Mootools,+特定于应用程序的代码,这会产生数千行代码.该元素可能是间接访问的.

Answer 1

Firebug 1.5将在HTML面板上进行"Break-on-Modify".请参阅http://getfirebug.com/doc/breakpoints/demo.html#html - 中断DOM(HTML)变异事件.

Answer 2

你怎么知道 JavaScript 正在修改这个值？因为看起来您已经知道它何时被调用（因为您知道它会发生变化），所以我建议在启动更改的第一个事件中的 Firebug 中设置一个断点（可能是其他元素中的 onclick 属性）。

很难告诉您一种“通用”方式来了解 javascript 中的何处正在改变 Foo 的值，因为有很多不同的方法、不同的库，每个方法都有其语法。

例如，如果您尝试搜索“Foo”但没有找到它，则脚本可能正在遍历 DOM 并将输入的值更改为“某物的第一个子项”。我会尝试搜索输入的父元素的名称或 ID，并从那里理解代码。

我通常只是尝试通过 Firebug 的调试技术来理解我使用的每个脚本中的 javascript 逻辑 - 但只是在使用库的脚本上。