Use o painel Elementos > Propriedades para procurar e filtrar as propriedades de objetos DOM.
Abrir o painel "Propriedades"
Para abrir o painel Propriedades, siga estas etapas:
- Abra o DevTools. Por padrão, o painel Elementos é aberto.
- Na árvore do DOM, selecione um nó.
- Abra a guia Propriedades. Se você não conseguir ver a guia, clique em Mais
e selecione-a no menu suspenso.
Identificar propriedades próprias
O painel Propriedades classifica e exibe as próprias propriedades do objeto primeiro e em negrito.
Encontrar a origem de uma propriedade herdada
O painel Propriedades avalia os acessadores em elementos integrados e os exibe no objeto como herdado e em fonte normal.
Para encontrar a origem de uma propriedade herdada, expanda um objeto, depois o [[Prototype]] dele, o [[Prototype]] aninhado e assim por diante.
Neste exemplo, você pode rastrear de onde veio a propriedade size herdada, localizando a própria propriedade original (em negrito) na cadeia do protótipo com o getter correspondente.
Além disso, as propriedades específicas dos protótipos são mostradas apenas neles, não nos objetos. Isso facilita o diagnóstico de objetos.
Propriedades de filtro
Para encontrar uma propriedade rapidamente, comece a digitar o nome ou valor dela na caixa de texto Filtro.
Mostrar todas as propriedades
Por padrão, o painel Propriedades não mostra propriedades com os valores null e undefined.
Para conferir todas as propriedades, marque Mostrar tudo.
Entender as propriedades
O painel Elementos > Propriedades mostra várias propriedades.
Propriedades simples
Propriedades simples são pares de <name>: <value>.
Objetos e matrizes
As propriedades recolhíveis (
) são objetos {} ou matrizes [].
Para mais informações sobre como inspecionar objetos JavaScript, consulte Inspecionar propriedades de objetos.
Propriedades que correspondem aos nós DOM
As propriedades que correspondem aos nós DOM são links. Clique em um link para selecionar o nó relevante na árvore do DOM.
Propriedades próprias e herdadas
As propriedades em negrito são as do objeto. Elas são definidas diretamente no objeto.
As propriedades em fonte normal são herdadas da cadeia do protótipo. Para mostrá-los, o DevTools avalia os acessadores relevantes em elementos HTML integrados.
O DevTools classifica as propriedades primeiro para facilitar a detecção.
Propriedades enumeráveis e não enumeráveis
As propriedades de tipos enumerados têm cores claras. As propriedades não enumeráveis são silenciadas.
É possível iterar as propriedades enumeráveis com o loop for … in ou o método Object.keys().
Métodos
Os métodos são marcados com um f ().
Para mais informações sobre as funções, consulte Inspecionar funções no Console.