Chrome的开发者工具很棒,但有一件事他们似乎没有(我能找到的),那就是找到JavaScript函数定义的方法。这对我来说非常方便,因为我正在一个包含许多外部JS文件的网站上工作。当然,grep解决了这个问题,但在浏览器中会更好。我的意思是,浏览器必须知道这个,所以为什么不公开它呢?我所期待的是:

从页面中选择“Inspect Element”,将突出显示元素选项卡中的行 右键单击该行并选择“Go to function definition” 在Scripts选项卡中加载正确的脚本,并跳转到函数定义

首先,这个功能是否存在,而我只是错过了它?

如果它没有,我猜这将来自WebKit,但找不到任何开发者工具功能请求或WebKit的Bugzilla。


当前回答

在Chrome控制台:

debug(MyFunction)
MyFunction()

其他回答

在谷歌chrome,检查元素工具,你可以查看任何Javascript函数定义。

单击Sources选项卡。然后选择索引页。搜索 函数。

选择函数,然后右键单击函数并选择 "在控制台中评估选定的文本。"

您可以通过在控制台中计算函数的名称来打印该函数,如下所示

> unknownFunc
function unknownFunc(unknown) {
    alert('unknown seems to be ' + unknown);
}

这对内置函数不起作用,它们只会显示[本机代码]而不是源代码。

EDIT:这意味着函数已在当前作用域内定义。

你遇到VM定义的JS功能,你可以在Chrome控制台面板下面试试这个命令。 是这样的: foo函数名是window.P.execute

>window.P.execute.toString()
<'function(d,h){function n(){var a=null;e?a=h:"function"===typeof h&&(p.start=w(),a=h.apply(f,wa(d,k,l)),p.end=w());if(b){H[d]=a;a=d;for(da[a]=!0;(z[a]||[]).length;)z[a].shift()();delete z[a]}p.done=!0}var k=g||this;"function"===typeof d&&(h=d,d=E);b&&(d=d?d.replace(ha,""):"__NONAME__",V.hasOwnProperty(d)&&k.error(q(", reregistered by ",q(" by ",d+" already registered",V[d]),k.attribution),d),V[d]=k.attribution);for(var l=[],m=0;m<a.length;m++)l[m]=\na[m].replace(ha,"");var p=B[d||"anon"+ ++xa]={depend:l,registered:w(),namespace:k.namespace};d&&ya.hasOwnProperty(d);c?n():ua(l,k.guardFatal(d,n),d);return{decorate:function(a){U[d]=k.guardFatal(d,a)}}}'

我们得到了完整的函数代码。

如果你已经在调试,你可以将鼠标悬停在函数上,工具提示将允许你直接导航到函数定义:

进一步阅读:

Chrome DevTools > JavaScript调试参考

2016年更新:Chrome版本51.0.2704.103

有一个转到成员的快捷方式(在设置>快捷方式>文本编辑器中列出)。打开包含你的函数的文件(在DevTools的源代码面板中),然后按:

ctrl + shift + O

或者在OS X中:

⌘+ shift + O

这样就可以列出和访问当前文件的成员。