Chrome 如何将HTML元素记录为JavaScript对象？

oxcyiej7 于 2023-05-27 发布在 Go

关注(0)|答案(3)|浏览(159)

使用Google Chrome，如果你console.log一个对象，它允许你在控制台中检查元素。例如：

var a = { "foo" : "bar", "whiz" : "bang" };
console.log(a);

这将打印出Object，可以通过单击旁边的箭头进行检查。但是，如果我尝试记录HTMLElement：

var b = goog.dom.query('html')[0];
console.log(b);

这将打印出<html></html>，单击旁边的箭头无法检查。如果我想看到JavaScript对象（及其方法和字段），而不仅仅是元素的DOM，我该怎么做？

google-chrome

来源：https://stackoverflow.com/questions/9633835/how-can-i-log-an-html-element-as-a-javascript-object

3条答案

按热度按时间

olmpazwi1#

使用console.dir：

var element = document.documentElement; // or any other element
console.log(element); // logs the expandable <html>…</html>
console.dir(element); // logs the element’s properties and values

如果您已经在控制台中，您可以简单地键入dir而不是console.dir：

dir(element); // logs the element’s properties and values

要简单地列出不同的属性名称（不包括值），可以使用Object.keys：

Object.keys(element); // logs the element’s property names

即使没有公共的console.keys()方法，如果你已经在控制台中，你可以输入：

keys(element); // logs the element’s property names

不过，这在控制台窗口之外是行不通的。

赞(0）回复(0）举报 2023-05-27

zzlelutf2#

试试这个：

console.dir(element)

参考资料

[Video] Paul Irish on becoming a console power user.

赞(0）回复(0）举报 2023-05-27

gstyhher3#

浏览器只打印HTML部分，可以把元素放在一个对象中看DOM结构。

console.log({element})

赞(0）回复(0）举报 2023-05-27

我来回答

Chrome 如何将HTML元素记录为JavaScript对象？

3条答案

相关问题

热门标签

最新问答