Chrome 控制台显示对象属性而不是 DOM 树

Question

我习惯使用 Firefox，因为它有很多有用的功能。然而，我需要开始使用 Chrome，这很困难

我需要的是在控制台中显示对象的属性。如何实现？Firefox - 我需要的

Chrome——它所做的毫无用处

那么如何实现相同的行为，或者至少在哪里可以获取此类列出对象的属性？

谢谢

Answer 1

您可以使用检查器或聚焦元素来选择一个 DOM 元素。您会在 chrome DevTool 上找到一个属性选项卡。您将找到所选对象的所有属性。

Answer 2

你无法改变这个行为。

但是，您可以解决这个问题（对于大多数用例）：右键单击所需元素，选择“在元素面板中显示”。然后它将被选中，您可以转到右侧属性窗格中的“属性”。

这不包括记录元素当前不是 DOM 一部分的用例。要处理这些情况，请使用console.dir而不是console.log：

console.dir(document)