Utiliser la méthode Éléments > Propriétés pour parcourir et filtrer les propriétés des objets DOM.
Ouvrir l'onglet "Propriétés"
Pour ouvrir l'onglet Propriétés, procédez comme suit :
- Ouvrez les outils de développement. Par défaut, le panneau Éléments s'ouvre.
- Dans l'arborescence DOM, sélectionnez un nœud.
- Ouvrez l'onglet Propriétés. Si l'onglet ne s'affiche pas, cliquez sur Plus , puis sélectionnez-le dans le menu déroulant.
Identifier vos propres établissements
L'onglet Propriétés trie et affiche les propres propriétés de l'objet en premier, en caractères gras.
Déterminer l'origine d'une propriété héritée
L'onglet Propriétés évalue les accesseurs sur les éléments intégrés et les affiche sur l'objet comme hérités, avec une police standard.
Pour trouver l'origine d'une propriété héritée, développez un objet, puis son [[Prototype]], sa propriété [[Prototype]] imbriquée, et ainsi de suite.
Dans cet exemple, vous pouvez déterminer d'où vient la propriété size héritée en localisant la propriété d'origine (en gras) sur la chaîne de prototype avec le getter correspondant.
De plus, les propriétés spécifiques aux prototypes ne sont montrées que sur les prototypes, pas sur les objets. Cela facilite le diagnostic des objets.
Propriétés de filtrage
Pour trouver rapidement une propriété, commencez à saisir son nom ou sa valeur dans la zone de saisie Filtrer.
Afficher toutes les propriétés
Par défaut, l'onglet Propriétés n'affiche pas les propriétés avec des valeurs null et undefined.
Pour afficher toutes les propriétés, cochez la case Tout afficher.
Comprendre les propriétés
La page Éléments > L'onglet Propriétés affiche diverses propriétés.
Propriétés simples
Les propriétés simples sont des paires de <name>: <value>.
Objets et tableaux
Les propriétés réductibles () correspondent aux objets {} ou aux tableaux [].
Pour en savoir plus sur l'inspection des objets JavaScript, consultez Inspecter les propriétés d'objet.
Propriétés correspondant aux nœuds DOM
Les propriétés correspondant aux nœuds DOM sont des liens. Cliquez sur un lien pour sélectionner le nœud approprié dans l'arborescence DOM.
Propriétés propres et héritées
Les propriétés en gras appartiennent à l'objet. Elles sont définies directement sur l'objet.
Les propriétés de la police standard sont héritées de la chaîne du prototype. Pour vous les afficher, DevTools évalue les accésseurs pertinents sur les éléments HTML intégrés.
Les outils de développement trient d'abord leurs propres propriétés pour les rendre plus faciles à repérer.
Propriétés énumérables et non énumérables
Les propriétés énumérables sont de couleur vive. Les propriétés non énumérables sont ignorées.
Vous pouvez itérer sur les propriétés énumérables à l'aide de la boucle for … in ou de la méthode Object.keys().
Méthodes
Les méthodes sont marquées d'un f ().
Pour en savoir plus sur les fonctions, consultez Inspecter les fonctions via la console.