Я пишу веб-сайт на PHP, и HTML-код, который он отображает, не очень хорошо отформатирован и трудно читается в Firefox (большая часть его находится в одной строке).
Я не хочу портить свой PHP-код, добавляя кучу вещей для форматирования пробелов, поэтому мне было интересно, есть ли опция или, возможно, дополнение к Firefox, которое даст мне возможность просматривать исходный текст с отступом в соответствии с структура HTML.
Ответы:
Работает просто отлично, установите расширение отсюда: https://addons.mozilla.org/en-US/firefox/addon/655/
Щелкните правой кнопкой мыши -> Просмотреть исходную диаграмму
Это то, что я получаю для исходного кода HTML на главной странице Google:
Перед:
После:
От сюда
Просмотр исходной диаграммы Графически отображает исходную структуру.
JSView 2.0.5 Отображает информацию о внешних файлах страницы.
HighlightAll Подсвечивает идентичные элементы в коде.
Html Validator Проверяет HTML текущей страницы.
Просмотр форматированного источника Показывает структуру источника.
SourceEditor Позволяет редактировать код и просматривать результаты.
Я обычно использую Firebug для отладки вывода html.
Это позволяет мне просматривать HTML, как он отображается браузером, вместе с хорошо отформатированным исходным кодом в Firebug. Я также могу проверить элементы в отображаемом html и посмотреть, откуда они берутся в исходном html-источнике.
Если кто-то ищет такую же функциональность в 2019 году, есть Fire Source Viewer [1] для Firefox Quantum, который отображает украшенный HTML DOM после того, как javascripts манипулирует им, что даже лучше, чем наличие только html-источника, доставляемого веб-сервером.
[1] https://addons.mozilla.org/en-US/firefox/addon/fire-source-viewer/
Расширение Web Developer добавляет различные инструменты для веб-разработчиков в браузер. Расширение доступно для Chrome и Firefox и будет работать на любой платформе, поддерживаемой этими браузерами, включая Windows, OS X и Linux
Viewменю исходного окна. Просто щелкните правой кнопкой мыши =>,View Page Sourceчтобы открыть это окно.