如何知道当前页面代码添加到窗口的对象？

Question

当我访问某个页面时，比如SPA，我知道有些对象被代码添加到window。

有没有办法知道什么是本机浏览器对象/方法，哪些是由应用程序添加的？

Answer 1

调用窗口变量基本上会给你一个内部所有内容的概述。我想如果你想知道它目前包含多少功能你可以做类似的事情：

Object.keys(window).length; //or just Object.keys for the names

要知道是否已将新功能添加到窗口对象，需要知道它们在包含之前的位置的数量，或者只知道静态数字。举几个例子。在stackoverflow上，window对象只包含246个键。然而，在像谷歌这样的东西我计算了1597键。所以它真的取决于你使用的应用程序。

所以你可以做的是编写一个函数来检查密钥的数量是否已经增加以及何时发生这种情况并取出密钥并将其移动到函数内部的数组中。

这正是我从你的问题得到的。

Answer 2

我想你正在寻找Mutation Observers。使用它们，您可以侦听新添加或删除的DOM元素。我相信您也会收到有关属性和文本更改的通知。

这是一篇关于它们的简短文章的链接。 Mutation Observers

希望这可以帮助！

Answer 3

假设您有两个单独的选项卡。一个不向窗口添加任何内容（很难找到），一个添加了一些属性的窗口。

两个都开放。

在干净的一个做：a = Object.keys(window); JSON.stringify(a);

复制结果并将其移动到已向窗口添加一些属性的选项卡。然后做a = JSON.parse(<Ctrl + v>)和b = Object.keys(window)

最后：c = b.filter(p=>a.indexOf(p)=== -1)

现在c包含该选项卡添加到窗口对象的所有属性的名称;

热门提示：Firefox Developer Edition默认执行此操作：a screenshot of how it works请注意，window的默认属性在不同的属性中分隔（称为[default properties））