Don't forget the Chrome Dev Summit, starting Monday at 10:00am (Pacific) and streaming live on YouTube. Schedule.

Inspecionar recursos

Organize recursos por quadro, domínio, tipo ou outros critérios.

TL;DR

  • Use a seção Frames do painel Application para organizar recursos por quadro.
  • Você também pode visualizar recursos por quadro no painel Sources desativando a opção group by folder.
  • Para visualizar recursos por domínio e pasta, use o painel Sources.
  • Filtre recursos por nome ou outro critério no painel Network.

Organizar recursos por quadro

Use a seção Frames do painel Application para ver uma representação dos recursos da página organizada por quadros.

detalhe dos quadros

  • O nível superior (top na imagem acima) é o documento principal.
  • Abaixo dele (por exemplo, widget2 na imagem acima) são subquadros do documento principal. Expanda um desses subquadros para visualizar os recursos que originaram esse quadro.
  • Abaixo dos subquadros ficam as imagens, scripts e outros recursos do documento principal.
  • Por último, o próprio documento principal.

Clique em um recurso para ver sua visualização.

Clique com o botão direito em um recurso para vê-lo no painel Network, abri-lo em uma nova guia, copiar seu URL ou salvá-lo.

visualizar recurso

Você também pode visualizar recursos por quadro no painel Sources clicando no menu flutuante do navegador e desativando a opção Group by folder para interromper o agrupamento de recursos por pasta.

opção group by folder

Os recursos serão listados apenas por quadro.

sem pastas

Organizar recursos por domínio e pasta

Para visualizar recursos organizados por domínio e diretório, use o painel Sources.

painel sources

Filtrar recursos por nome, tipo ou outros critérios

Use o painel Network para filtrar recursos por nome, tipo e uma grande variedade de outros critérios. Confira o guia abaixo para saber mais.