Attribute von DOM-Objekten ansehen

Sofia Emelianova
Sofia Emelianova
GitHub

Auf dem Tab Elemente > Eigenschaften können Sie die Eigenschaften von DOM-Objekten ansehen und filtern.

Tab „Eigenschaften“ öffnen

So öffnen Sie den Tab Eigenschaften:

  1. Öffnen Sie die Entwicklertools. Standardmäßig wird der Bereich Elemente geöffnet.
  2. Wählen Sie in der DOM-Baumstruktur einen Knoten aus.
  3. Wechseln Sie zum Tab Eigenschaften. Wenn der Tab nicht angezeigt wird, klicken Sie auf das Dreipunkt-Menü Mehr und wählen Sie ihn dann aus dem Drop-down-Menü aus.

Elementbereich mit geöffnetem Tab „Eigenschaften“

Eigene Unterkünfte erkennen

Auf dem Tab Properties werden die eigenen Properties des Objekts zuerst und fett formatiert angezeigt.

ALT_TEXT_HERE

Ursprung einer übernommenen Property ermitteln

Auf dem Tab Eigenschaften werden die Zugriffsmethoden für integrierte Elemente ausgewertet und im Objekt übernommen in normaler Schriftart angezeigt.

Wenn Sie den Ursprung einer übernommenen Property ermitteln möchten, maximieren Sie ein Objekt, dann die zugehörige [[Prototype]] und dann die verschachtelte [[Prototype]] usw.

Die Größe des Attributs wird bis zu seinem Getter in der Prototypkette zurückverfolgt.

In diesem Beispiel können Sie nachvollziehen, woher die übernommene size-Eigenschaft stammt, indem Sie die ursprüngliche eigene Eigenschaft (fett) in der Prototypkette zusammen mit dem entsprechenden Getter suchen.

Außerdem werden prototypspezifische Eigenschaften nur auf Prototypen und nicht auf Objekten angezeigt. So lassen sich Objekte leichter diagnostizieren.

Prototypenspezifische Eigenschaften.

Filtereigenschaften

Wenn Sie eine Property schnell finden möchten, geben Sie ihren Namen oder Wert in das Eingabefeld Filter ein.

Filter

Alle Unterkünfte anzeigen

Standardmäßig werden auf dem Tab Properties (Properties) keine Properties mit null- und undefined-Werten angezeigt.

Wenn Sie alle Unterkünfte sehen möchten, klicken Sie das Kästchen Alle anzeigen an.

Unterkünfte mit Nullwerten

Informationen zu Properties

Auf dem Tab Elemente > Eigenschaften wird eine Vielzahl von Eigenschaften angezeigt.

Einfache Eigenschaften

Einfache Properties sind Paare von <name>: <value>. Einfache Unterkünfte.

Objekte und Arrays

Zusammenklappbare Eigenschaften () sind Objekte {} oder Arrays []. Zusammenklappbare Unterkünfte

Weitere Informationen zum Prüfen von JavaScript-Objekten finden Sie unter Objekteigenschaften prüfen.

Attribute, die DOM-Knoten entsprechen

Properties, die DOM-Knoten entsprechen, sind Links. Klicken Sie auf einen Link, um den entsprechenden Knoten im DOM-Baum auszuwählen. Link zum Haupt-DOM-Knoten.

Eigene und übernommene Properties

Fett formatierte Eigenschaften sind die eigenen Objekte. Sie werden direkt auf dem Objekt definiert.

Eigenschaften in normaler Schrift werden aus der Prototyp-Kette übernommen. Dazu werden in den DevTools relevante Accessoren in integrierten HTML-Elementen ausgewertet. Eigene und übernommene Properties In den DevTools werden eigene Properties zuerst sortiert, damit sie leichter zu erkennen sind.

Enumerate und non-enumerable Properties

Eigenschaften, die gezählt werden können, sind hell. Nicht aufzählbare Properties werden ausgeblendet. Auflistbare und nicht aufzählbare Attribute. Sie können mit der for … in-Schleife oder der Object.keys()-Methode über die zählbaren Eigenschaften iterieren.

Methoden

Methoden sind mit einem f () gekennzeichnet. Methode.

Weitere Informationen zu Funktionen finden Sie unter Funktionen prüfen in der Console.