如何找到修改元素的 JavaScript 片段？
我尝试检查的页面在页面上有一个隐藏的
有工具可以帮助我找到 javascript 中使用/修改该元素的位置（如果有）？ ，如何？
注意：如果尝试在代码中查找“Foo”，但没有找到任何匹配的标题，则加载了 JSON 和 Mootools，+应用程序特定的代码，这可能会导致数千行代码被访问。间接地。
The page I'm trying inspect has a hidden <input type="hidden" name="Foo" value="123 /> element on a page, where Javascript/AJAX modifies the value. I'm trying to find where on earth in Javascript is the code that modifies this value from time to time.
Is there a tool that could help me find the places in javascript that use/modify that element? Does Firebug provide this, if so, how?
Note: If tried looking for "Foo" in the code, but I haven't found any matching titles. There's JSON and Mootools loaded, +application specific code, which results several thousands lines of code. The element is probably accessed indirectly.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（3）
Firebug 1.5 将在 HTML 面板上提供“Break-on-Modify”。请参阅http://getfirebug.com/doc/breakpoints/demo.html#html - DOM (HTML) 突变事件中断。
Firebug 1.5 will have "Break-on-Modify" on the HTML panel. See http://getfirebug.com/doc/breakpoints/demo.html#html - Break on DOM (HTML) Mutation Events.
你怎么知道 JavaScript 正在修改这个值？因为看起来您已经知道它何时被调用（因为您知道它会发生变化），所以我建议在启动更改的第一个事件中的 Firebug 中设置一个断点（可能是其他元素中的 onclick 属性）。
很难告诉您一种“通用”方式来了解 javascript 中的何处正在改变 Foo 的值，因为有很多不同的方法、不同的库，每个方法都有自己的语法。
例如，如果您尝试搜索“Foo”但没有找到它，则脚本可能正在遍历 DOM 并将输入的值更改为“某物的第一个子项”。我会尝试搜索输入的父元素的名称或 ID，并从那里理解代码。
我通常只是尝试通过 Firebug 的调试技术来理解我使用的每个脚本中的 javascript 逻辑 - 但只是在使用库的脚本上。
How do you know that the javascript is modifying this value? Since it looks you already know when it's called (since you know it changes), I would suggest a breakpoint in Firebug in the first event that initiates the changing (probably an onclick attribute in other element).
It's kind of hard telling you a "generic" way of knowing where in javascript it's changing Foo's value since there are a lot of different approachs, different libraries, each one with it's syntax.
For example, if you tried searching "Foo" and didn't find it, the script may be traversing the DOM and changing the input's value as a "first child of something". I would try to search for names or ids of input's parent elements and understand the code from there.
I usually just try to understand the javascript logic from every script I use with Firebug's debugging techniques - but just on the script that uses the libraries.
如果 Firebug 不允许您在设置某些值时定义断点，您可以在页面中插入类似以下内容（仅限 Firefox）：
在 Firebug 中的函数上设置断点或使用
console.log或无论如何将堆栈转储到萤火虫控制台。我记得在某处看到过关于 Firebug 计划的演示，其中包括有关要支持的各种断点的部分，但我现在找不到它的链接。
[编辑] 以上是通过分配给 value 属性来设置值的情况：
.value = ...。如果您需要捕获属性更改的时刻（.setAttribute("value", ...)），您可以使用 DOM 突变侦听器。If Firebug doesn't let you define breakpoints on setting some value, you could insert something like this in the page (Firefox-only):
And either breakpoint on the function in Firebug or use
console.logor whatever to dump the stack to the firebug console.I remember seeing somewhere a presentation on Firebug plans, which included a section on various kinds of breakpoints to be supported, but I can't find a link to it right now.
[edit] The above is for the case the value is set by assigning to the value property:
.value = .... If you need to catch the moment an attribute is changed (.setAttribute("value", ...)), you can use DOM mutation listeners.