如何使用Chrome'查看窗口对象中定义了哪些变量;的开发工具

How can I see what variables are defined in the window object with Chrome's developer tools?

本文关键字:定义 开发工具 变量 窗口 Chrome 何使用 对象      更新时间:2024-06-24

我曾经有一个简单的解决方案来解决这个问题:打开开发人员工具控制台,开始键入一个或几个字母…然后砰的一声,chrome会自动完成window中(或调试时this对象中)可用的任何变量名。我主要使用这个来查看是否定义了类似jQuery的东西
最近,Chrome的控制台有了一个新的自动完成功能,可以自动完成以前键入的语句。我现在不能再使用旧的工作流程来查找可用的变量了。

我发现,通过首先键入window.(注意句点),你会得到自动完成的变量名列表,就像在旧版本的Chrome中一样,但它也会包括以前评估过的语句。

键入window,然后按回车键将打印窗口对象;展开它将显示所有已定义的变量和成员,但我喜欢旧的方式,它可以让您通过键入前几个起始字符轻松进行筛选。

切换到Chrome的测试版频道。

打开开发工具(F12),转到设置(F1)。在"控制台"下,取消选中"从历史自动完成"。现在你会得到一个自动完成的变量名列表,就像它在旧版本的Chrome中一样。

键入window,然后按回车键,将打印窗口对象;展开它还将显示所有已定义的变量和成员。

我构建了一个名为JS-Digger的chrome扩展,它允许您搜索窗口对象中定义的变量名和值。

JS Digger链接:https://chrome.google.com/webstore/detail/js-digger/ndindkkcbpmfoinihohmhdhphgpiofbb?hl=en&authuser=3