如何跟踪 Javascript 事件（堆栈跟踪）？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/3283576/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to trace Javascript events (Stack Trace )?
提问by Abdullah
In any programming language, I can trace any function and know which function is called by other. But in Javascript , I don't know how, since the code is not written by meand Firebug does not give this feature - as far as I know.
在任何编程语言中，我都可以跟踪任何函数并知道哪个函数被其他函数调用。但在 Javascript 中，我不知道如何，因为代码不是我写的，Firebug 没有提供这个功能 - 据我所知。
An example :
一个例子 ：
I want to display the function names of each function that is called when clicking on XYZ Element, and display them in order.
我想显示点击XYZ元素时调用的每个函数的函数名称，并按顺序显示它们。
Thanks.
谢谢。
回答by Allen Rice
Found this: A javascript stacktrace in any browser, Jamessays they have a github account now
发现这个：任何浏览器中的 javascript 堆栈跟踪，詹姆斯说他们现在有一个github 帐户
function printStackTrace() {
var callstack = [];
var isCallstackPopulated = false;
try {
i.dont.exist+=0; //doesn't exist- that's the point
} catch(e) {
if (e.stack) { //Firefox
var lines = e.stack.split('\n');
for (var i=0, len=lines.length; i<len; i++) {
if (lines[i].match(/^\s*[A-Za-z0-9\-_$]+\(/)) {
callstack.push(lines[i]);
}
}
//Remove call to printStackTrace()
callstack.shift();
isCallstackPopulated = true;
}
else if (window.opera && e.message) { //Opera
var lines = e.message.split('\n');
for (var i=0, len=lines.length; i<len; i++) {
if (lines[i].match(/^\s*[A-Za-z0-9\-_$]+\(/)) {
var entry = lines[i];
//Append next line also since it has the file info
if (lines[i+1]) {
entry += " at " + lines[i+1];
i++;
}
callstack.push(entry);
}
}
//Remove call to printStackTrace()
callstack.shift();
isCallstackPopulated = true;
}
}
if (!isCallstackPopulated) { //IE and Safari
var currentFunction = arguments.callee.caller;
while (currentFunction) {
var fn = currentFunction.toString();
var fname = fn.substring(fn.indexOf("function") + 8, fn.indexOf('')) || 'anonymous';
callstack.push(fname);
currentFunction = currentFunction.caller;
}
}
output(callstack);
}
function output(arr) {
// Output however you want
alert(arr.join('\n\n'));
}
回答by godswearhats
You can see the stack trace of any error with the stack()function call (on Firefox). Creating a simple function to print a stack trace could look like this:
您可以通过stack()函数调用（在 Firefox 上）查看任何错误的堆栈跟踪。创建一个简单的函数来打印堆栈跟踪可能如下所示：
function getStackTrace() {
try {
unusedVariable++; // This creates an error we can trace
}
catch (e) {
return e.stack;
}
}
Other browsers have different ways of printing the stack trace, but this should get you what you need for Firefox.
其他浏览器有不同的打印堆栈跟踪的方式，但这应该可以满足您对 Firefox 的需求。
Hope this helps.
希望这可以帮助。
回答by Teja Kantamneni
DynaTrace AJAXhas some of the features like that. Not exactly what you are looking for but gives you the events and functions bound on an element and helps your troubleshooting. Had a free download, check it.
DynaTrace AJAX具有一些类似的功能。不完全是您正在寻找的，但为您提供绑定在元素上的事件和函数并帮助您进行故障排除。有一个免费下载，检查它。
回答by casablanca
If you simply want to debug your code, your best option is to get a debugger plug-in for your browser. The Firebug plug-in does provide stack traces. (see here)
如果您只是想调试代码，最好的选择是为您的浏览器安装调试器插件。Firebug 插件确实提供了堆栈跟踪。（见这里）
If you want to do it from within your code, there is no standard language feature of JavaScript that allows you to do this. Different browsers mayimplement non-standard extensions, but you shouldn't rely on them.
如果您想在代码中执行此操作，则 JavaScript 没有标准语言功能允许您执行此操作。不同的浏览器可能会实现非标准扩展，但您不应依赖它们。
回答by Ideogram
As "Casablanca" mentions... please note from the site of the aforementioned js-stack-trace ( http://www.eriwen.com/javascript/js-stack-trace/) that in FireFox and Chrome:
正如“卡萨布兰卡”所提到的......请注意上述 js-stack-trace ( http://www.eriwen.com/javascript/js-stack-trace/)的站点 ，在 FireFox 和 Chrome 中：
Obvious easy way: Firebug, Chrome Dev Tools, Dragonfly etc.
You can easily get a stack trace at any time by calling console.trace() in your Javascript or in the Firebug console.
显而易见的简单方法：Firebug、Chrome Dev Tools、Dragonfly 等。
您可以随时通过在 Javascript 或 Firebug 控制台中调用 console.trace() 轻松获取堆栈跟踪。
