เป็นไปได้ไหมที่จะดูรูปแบบ HTML อัตโนมัติใน Firefox

ฉันกำลังเขียนเว็บไซต์ใน PHP และ HTML ที่แสดงผลนั้นมีการจัดรูปแบบไม่ดีและอ่านยากใน Firefox (ส่วนใหญ่อยู่ในบรรทัดเดียว)

ฉันไม่ต้องการทำให้โค้ด PHP ของฉันยุ่งเหยิงโดยการเพิ่มสิ่งต่าง ๆ ในการจัดรูปแบบพื้นที่สีขาวดังนั้นฉันจึงสงสัยว่ามีตัวเลือกหรืออาจเป็นส่วนเสริมของ Firefox ที่จะให้ความสามารถในการดูแหล่งที่เยื้องตาม โครงสร้างของ HTML

ดูแผนภูมิที่มา 2.7

ใช้งานได้ดีติดตั้งส่วนขยายจากที่นี่: https://addons.mozilla.org/en-US/firefox/addon/655/

คลิกขวา -> ดูแผนภูมิแหล่งที่มา

นี่คือสิ่งที่ฉันได้รับสำหรับแหล่งที่มา HTML ของหน้าแรกของ Google:

ก่อน:

หลังจาก:

จากที่นี่

ดูแผนภูมิแหล่งที่มา แสดงโครงสร้างแหล่งที่มากราฟิก

JSView 2.0.5 แสดงข้อมูลเกี่ยวกับไฟล์ภายนอกของหน้า

เน้น องค์ประกอบที่เหมือนกันทั้งหมดในรหัส

Html Validator ตรวจสอบ HTML ของหน้าปัจจุบัน

ดูแหล่งที่จัดรูปแบบ แสดงโครงสร้างแหล่งที่มา

SourceEditor อนุญาตให้แก้ไขรหัสและดูผลลัพธ์

ปกติฉันจะใช้Firebugสำหรับการดีบักเอาต์พุต html

สิ่งนี้ทำให้ฉันสามารถมองเห็น html เมื่อเบราว์เซอร์แสดงผลพร้อมกับแหล่งที่จัดรูปแบบที่ดีใน Firebug ฉันยังสามารถตรวจสอบองค์ประกอบใน html ที่แสดงและดูว่าพวกเขามาจากที่ใดในแหล่งที่มาของ html

หากทุกคนกำลังมองหาฟังก์ชั่นเดียวกันในปี 2019 มี Fire Source Viewer [1] สำหรับ Firefox Quantum ซึ่งแสดง DOM HTML ที่สวยงามหลังจากที่ javascripts ใช้มัน

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

ปลั๊กอินสำหรับนักพัฒนาเว็บ:

ส่วนขยายนักพัฒนาเว็บเพิ่มเครื่องมือสำหรับนักพัฒนาเว็บต่าง ๆ ให้กับเบราว์เซอร์ ส่วนขยายพร้อมใช้งานสำหรับ Chrome และ Firefox และจะทำงานบนแพลตฟอร์มใดก็ได้ที่เบราว์เซอร์เหล่านี้รองรับรวมถึง Windows, OS X และ Linux