[javascript] HTML 요소를 JavaScript 객체로 기록하려면 어떻게해야합니까?

Google 크롬을 사용 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>옆에있는 화살표를 클릭하여 검사 할 수없는 것을 인쇄 합니다. 요소의 DOM 대신 JavaScript 객체 (메서드 및 필드 포함)를보고 싶다면 어떻게해야합니까?



답변

사용 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

하지만 콘솔 창 밖에서는 작동하지 않습니다.


답변

이 시도:

console.dir(element)

참조
[동영상] 콘솔 파워 유저가되는 것에 대한 Paul Irish.


답변

브라우저는 html 부분 만 인쇄하고, 요소를 개체에 넣어 돔 구조를 볼 수 있습니다.

console.log({element})


답변