Ist es möglich, in Firefox automatisch formatierte HTML-Quellen anzuzeigen?

10

Ich schreibe eine Website in PHP, und der von ihr gerenderte HTML-Code ist nicht gut formatiert und in Firefox schwer zu lesen (das meiste davon befindet sich in einer einzelnen Zeile).

Ich möchte meinen PHP-Code nicht durch Hinzufügen von Leerzeichen formatieren. Daher habe ich mich gefragt, ob es eine Option oder ein Add-On für Firefox gibt, mit dem ich die eingerückte Quelle anzeigen kann die HTML-Struktur.

— Willbill
quelle

Beachten Sie, dass neuere Versionen von Firefox (ich glaube, es war seit 4, bestätigt für 10+) die Möglichkeit bieten, Syntaxhervorhebungen und Zeilenumbrüche im ViewMenü des Quellfensters durchzuführen. Klicken Sie einfach mit der rechten Maustaste => View Page Source, um dieses Fenster zu öffnen.

— Bob

11

Quellendiagramm anzeigen 2.7

Funktioniert einwandfrei, installieren Sie die Erweiterung von hier: https://addons.mozilla.org/en-US/firefox/addon/655/

Rechtsklick -> Quelldiagramm anzeigen

Folgendes erhalte ich für die HTML-Quelle der Google-Startseite:

Vor:

Alt-Text

Nach:

Alt-Text

— Gaff
quelle

5

Von hier aus

Quellendiagramm anzeigen Zeigt die Quellstruktur grafisch an.

Alt-Text

JSView 2.0.5 Zeigt Informationen zu externen Dateien an.

Alt-Text

HighlightAll Hebt identische Elemente im Code hervor.

Alt-Text

Html Validator Überprüft den HTML- Code der aktuellen Seite.

Alt-Text

Formatierte Quelle anzeigen Zeigt die Quellstruktur an.

Alt-Text

SourceEditor Ermöglicht das Bearbeiten von Code und das Anzeigen der Ergebnisse.

Alt-Text

— Joe
quelle

3

Normalerweise verwende ich Firebug zum Debuggen der HTML-Ausgabe.

Auf diese Weise kann ich das vom Browser gerenderte HTML zusammen mit der gut formatierten Quelle in Firebug sehen. Ich kann auch Elemente im angezeigten HTML-Code überprüfen und feststellen, woher sie in der ursprünglichen HTML-Quelle stammen.

— harrymc
quelle

1

Wenn jemand 2019 nach der gleichen Funktionalität sucht, gibt es Fire Source Viewer [1] für Firefox Quantum, der das verschönerte HTML-DOM anzeigt, nachdem Javascripts es manipuliert haben. Dies ist sogar noch besser, als wenn nur die HTML-Quelle vom Webserver bereitgestellt wird.

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

— dasj19
quelle

0

Webentwickler-Plugin:

Die Web Developer-Erweiterung fügt einem Browser verschiedene Web Developer-Tools hinzu. Die Erweiterung ist für Chrome und Firefox verfügbar und kann auf jeder Plattform ausgeführt werden, die diese Browser unterstützen, einschließlich Windows, OS X und Linux

Geben Sie hier die Bildbeschreibung ein

— Angelo
quelle

Ich habe dies installiert, aber seine Dosierung tut, was ich brauche. Ich glaube, ich war nicht sauber genug, was ich mit "formatiert" meine. Ich werde die Frage jetzt bearbeiten

— Willbill

Geben Sie zumindest eine kurze Beschreibung des hervorstechenden Merkmals des Plugins, das sich auf die Frage bezieht. Ansonsten ist es nur eine flippige Antwort.

— zufällig

Das Webentwickler-Plugin ist ein sehr beliebtes Plugin, mit dem unter anderem die Quelle für jede Seite angezeigt werden kann. Die Quellansicht hat einige Hervorhebungen, ist also "formatiert" - obwohl ich jetzt sehe, dass das OP etwas Spezifischeres für die Formatierung wünscht.

— Angelo