Użyj menu Elementy > Na karcie Właściwości możesz przeglądać i filtrować właściwości obiektów DOM.
Otwórz kartę Właściwości.
Aby otworzyć kartę Właściwości, wykonaj te czynności:
- Otwórz Narzędzia deweloperskie. Domyślnie otworzy się panel Elementy.
- W drzewie DOM wybierz węzeł.
- Otwórz kartę Właściwości. Jeśli nie widzisz tej karty, kliknij Więcej i wybierz ją z menu.
Własne właściwości Spota
Na karcie Właściwości najpierw sortowane są własne właściwości obiektu, a czcionka jest pogrubiona.
Znajdowanie pochodzenia dziedziczonej właściwości
Karta Właściwości ocenia metody dostępu w wbudowanych elementach i wyświetla je w obiekcie jako odziedziczone i w zwykłym kroju pisma.
Aby znaleźć pochodzenie odziedzonej właściwości, rozwiń obiekt, a potem jego [[Prototype]]
, a potem zagnieżdżony [[Prototype]]
itd.
W tym przykładzie możesz sprawdzić, skąd pochodzi odziedziczona właściwość size
, znajdując własną (pogrubioną) właściwość w łańcuchu prototypu razem z odpowiednią metodą getter.
Dodatkowo właściwości specyficzne dla prototypów są wyświetlane tylko w prototypach, a nie w obiektach. Ułatwia to diagnozowanie obiektów.
Filtruj usługi
Aby szybko znaleźć właściwość, zacznij wpisywać jej nazwę lub wartość w polu do wprowadzania danych Filtr.
Pokaż wszystkie właściwości
Domyślnie na karcie Właściwości nie wyświetlają się właściwości z wartościami null
i undefined
.
Aby wyświetlić wszystkie właściwości, zaznacz Pokaż wszystkie.
Właściwości
Na karcie Elementy > Właściwości znajdziesz różne właściwości.
Właściwości proste
Proste właściwości to pary wartości <name>: <value>
.
Obiekty i tablice
Właściwości zwijane ({}
i tablice []
.
Więcej informacji o sprawdzaniu obiektów JavaScript znajdziesz w artykule Sprawdzanie właściwości obiektów.
Właściwości odpowiadające węzłom DOM
Właściwości odpowiadające węzłom DOM to połączenia. Kliknij link, aby wybrać odpowiedni węzeł w drzewie DOM.
Usługi własne i dziedziczone
Właściwości wyróżnione pogrubioną czcionką należą do obiektu. Są one definiowane bezpośrednio na obiekcie.
Właściwości w zwykłym czcionce są dziedziczone z łańcucha prototypów. Aby je wyświetlić, DevTools ocenia odpowiednie metody dostępu w wbudowanych elementach HTML. Narzędzia deweloperskie najpierw sortują własne właściwości, aby ułatwić ich rozpoznanie.
Właściwości wyliczalne i niewyliczalne
Właściwości zliczalne mają jasny kolor. Właściwości niewyliczalne są wyciszone.
Możesz przetwarzać właściwości zliczalne za pomocą pętli for … in
lub metody Object.keys()
.
Metody
Metody są oznaczone ikoną f ()
.
Więcej informacji o funkcjach znajdziesz w artykule Sprawdzanie funkcji za pomocą Konsoli.