109 votes

Comment puis-je enregistrer un élément HTML en tant qu'objet JavaScript ?

Avec Google Chrome, si vous console.log un objet, il vous permet d'inspecter l'élément dans la console. Par exemple, il permet d'inspecter l'élément dans la console :

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

Il s'agit de l'impression Object qui peut être inspecté en cliquant sur les flèches situées à côté. Cependant, si j'essaie d'enregistrer un HTMLElement :

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

Il s'agit de l'impression <html></html> qui ne peut être inspecté en cliquant sur les flèches situées à côté. Si je veux voir l'objet JavaScript (avec ses méthodes et ses champs) au lieu du seul DOM de l'élément, comment puis-je faire ?

207voto

Mathias Bynens Points 41065

Utilisation 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

Si vous êtes déjà dans la console, vous pouvez simplement taper dir au lieu de console.dir :

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

Pour lister simplement les différents noms de propriétés (sans les valeurs), vous pouvez utiliser Object.keys :

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

Même s'il n'y a pas de console.keys() si vous êtes déjà dans la console, vous pouvez simplement entrer :

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

Cependant, cela ne fonctionnera pas en dehors de la fenêtre de la console.

34voto

Ross Points 5397

8voto

Navid Shad Points 93

Le navigateur n'imprime que la partie html, vous pouvez placer l'élément dans un objet pour voir la structure du dôme.

console.log({element})

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X