在Chrome中查找JavaScript函数定义

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

  • 从页面中select“检查元素”,这会突出显示“元素”选项卡中的行
  • 右键单击该行并select“转到函数定义”
  • 正确的脚本被加载到脚本标签中,并跳转到函数定义

首先,这个function是否存在,我只是想念它?

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

6 Solutions collect form web for “在Chrome中查找JavaScript函数定义”

假设我们正在寻找名为foo函数:

  1. (打开Chrome开发工具),
  2. Windows: ctrl + shift + F或macOS: cmd + optn + F。 这将打开一个search所有脚本的窗口。
  3. 选中“正则expression式”checkbox,
  4. searchfoo\s*=\s*function (在这三个令牌之间使用任意数量的空格searchfoo = function ),
  5. 按下返回的结果。

函数定义的另一个变体是function\s*foo\s*\(对于function foo(在这三个标记之间有任意数量的空格)。

这在Chrome上登陆2012-08-26不知道确切的版本,我注意到它在Chrome 24。

截图是值得一百万字: 在这里输入图像描述

我正在使用控制台中的方法检查对象。 点击“显示函数定义”将我带到函数定义的源代码中。 或者我可以将鼠标hover在function () {单词在工具提示中看到函数体。 你可以很容易地检查整个原型链像这样! CDT绝对摇滚!

希望大家都觉得有用!

您可以通过在控制台中评估它的名称来打印该function,如下所示

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

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

编辑 :这意味着该函数已被定义在当前范围内。

2016更新 :Chrome版本51.0.2704.103

有一个Go to member快捷方式(列在settings > shortcut > Text Editor ):

按Ctrl + Shift + O

或在OS X中:

+ shift + O

这使得能够列出并到达当前文件的成员。

导航到函数定义位置的另一种方法是在debugging器中打开某个可以访问该函数的位置,然后在控制台中input函数完全限定的名称。 这将打印控制台中的函数定义,并给出一个链接,点击打开脚本位置的function定义。

http://j.mp/1bfPfik

不同的浏览器做这个不同。

  1. 首先打开控制台窗口,右键单击页面并select“检查元素”,或按F12

  2. 在控制台中,input…

    • 火狐

       functionName.toSource() 
    •  functionName 
  • 在Chrome中embeddedJavaScriptredirect之前打破JavaScript
  • 如何在Chrome开发者工具中禁用JavaScript
  • 我可以得到chrome-devtools来实际search所有JS源代码吗?
  • 为什么Chrome在jQuery中的某一行暂停?
  • Chrome开发工具:如何跟踪networking的链接,打开一个新的标签?
  • 你如何检查铬检查员?
  • 在Chrome中的Javascript执行跟踪 - 如何?
  • Chromedebugging器的分析器中的“(程序)”是什么?
  • 如何在Google Chrome中进行debugging时终止脚本执行?
  • 如何在Chrome开发人员工具中使用XPath或CSSselect器searchDOM元素?
  • 我如何debuggingNode.js应用程序?