Как я могу зарегистрировать элемент HTML как объект JavaScript?

Question 1

Используя 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 элемента, как бы я это сделал?

Question 2

Использование 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

Однако это не будет работать за пределами окна консоли.

Question 3

попробуй это:

console.dir(element)

Ссылка
[Видео] Пол Айриш о том, как стал опытным пользователем консоли.

Question 4

Браузер печатает только html-часть, вы можете поместить элемент в объект, чтобы увидеть структуру купола.

console.log({element})