É possível visualizar a fonte HTML formatada automaticamente no Firefox

10

Estou escrevendo um site em PHP e o HTML renderizado não é bem formatado e difícil de ler no Firefox (a maioria está em uma única linha).

Eu não quero estragar meu código PHP adicionando um monte de material de formatação de espaço em branco, então eu queria saber se existe uma opção ou talvez um complemento para o Firefox que me permita visualizar o código recuado de acordo com a estrutura do HTML.

— Willbill
fonte

Observe que as versões recentes do Firefox (acho que desde 4, confirmadas para 10 ou mais) vêm com a capacidade de destacar sintaxe e agrupar palavras no Viewmenu da janela de origem. Basta clicar com o botão direito => View Page Sourcepara abrir esta janela.

— Bob

11

Ver gráfico da fonte 2.7

Funciona muito bem, instale a extensão a partir daqui: https://addons.mozilla.org/en-US/firefox/addon/655/

Clique com o botão direito do mouse -> Exibir gráfico de origem

É o que recebo da fonte HTML da página inicial do Google:

Antes:

texto alternativo

Depois de:

texto alternativo

— Gaff
fonte

5

A partir daqui

Exibir gráfico de origem Exibe graficamente a estrutura de origem.

texto alternativo

JSView 2.0.5 Exibe informações nos arquivos externos da página.

texto alternativo

HighlightAll Destaca elementos idênticos no código.

texto alternativo

Validador de HTML Valida o HTML da página atual.

texto alternativo

Visualizar fonte formatada Mostra a estrutura da fonte.

texto alternativo

SourceEditor Permite editar o código e visualizar os resultados.

texto alternativo

— Joe
fonte

3

Eu normalmente uso o Firebug para depurar a saída html.

Isso me permite ver o html como ele é renderizado pelo navegador, junto com a fonte bem formatada no Firebug. Também posso inspecionar elementos no html exibido e ver de onde eles vêm na fonte html de origem.

— harrymc
fonte

1

Se alguém estiver procurando pela mesma funcionalidade em 2019, há o Fire Source Viewer [1] para Firefox Quantum, que exibe o DOM HTML embelezado depois que o javascripts a manipula, o que é ainda melhor do que ter apenas a fonte html entregue pelo servidor da web.

[1] https://addons.mozilla.org/pt-BR/firefox/addon/fire-source-viewer/

— dasj19
fonte

0

Plug-in de desenvolvedor da Web:

A extensão Web Developer adiciona várias ferramentas de desenvolvedor web a um navegador. A extensão está disponível para Chrome e Firefox e será executada em qualquer plataforma compatível com esses navegadores, incluindo Windows, OS X e Linux

insira a descrição da imagem aqui

— Angelo
fonte

Tenho esta instalado, mas a sua dosent fazer o que eu preciso pensar que eu não ter sido suficiente limpo sobre o que quero dizer com "formatado" Vou editar a questão agora

— Willbill

Pelo menos, faça uma breve descrição do recurso destacado do plug-in relacionado à questão. Caso contrário, é apenas uma resposta irreverente.

— random

O plugin para desenvolvedor web é um plugin muito popular que, entre outras coisas, permite visualizar a fonte de qualquer página. A exibição da fonte tem alguns destaques, por isso é "formatada" - embora agora eu veja que o OP deseja algo mais específico para a formatação.

— Angelo