简体繁体 English

如何跟踪“不可见”的 JavaScript 功能？

[英]How can I track “invisible” JavaScript functionality?

原文 2013-07-27 17:25:31 6 1 javascript/ debugging/ events/ dom-events/ firebug

How can I track/trace back to (or capture) the actual coding of "invisible" JavaScript functionality?如何跟踪/追溯（或捕获）“不可见”JavaScript 功能的实际编码？

On a number of websites, I'll often find a button that does something, like submit a message, but when I hover the mouse over the button, there is either no link attached, or just a "#" left as the link.在许多网站上，我经常会发现一个按钮可以执行某些操作，例如提交消息，但是当我将鼠标悬停在按钮上时，要么没有附加链接，要么只剩下一个“#”作为链接。

Looking in the page's code, there usually isn't any surrounding Javascript near the location of the element that would give it its functionality.查看页面的代码，通常在元素位置附近没有任何可以为其提供功能的周围 Javascript。

How does one both trace what's actually happening when the button is clicked, and track to the source of where this functionality is implemented in the code?如何跟踪单击按钮时实际发生的情况，并跟踪该功能在代码中的实现位置？ Surely, there must be a quicker, more effective way than manually searching all the code and external Javascript files for any specific reference to the element (like the button)...?当然，必须有比手动搜索所有代码和外部 Javascript 文件以查找对元素的任何特定引用（如按钮）的更快、更有效的方法......？

(For reference, I'm using Firefox w/ Firebug) （作为参考，我使用的是带有 Firebug 的 Firefox）

1 个解决方案

I am not sure about FireBug, but if you debug using Chrome, you can do the following:我不确定 FireBug，但如果您使用 Chrome 进行调试，您可以执行以下操作：

Open the Developer View (Ctrl+Shift+J)打开开发者视图 (Ctrl+Shift+J)
Go to the 'Elements' Tab and select your button转到“元素”选项卡并选择您的按钮
On the Properties (to the right), scroll down to "Event Listeners".在属性（右侧）上，向下滚动到“事件侦听器”。
Look for the "click" event and expand it寻找“click”事件并展开它

There you have a link to the code that will run when the button is pressed.在那里您有一个指向将在按下按钮时运行的代码的链接。