Hemsida » Kodning » Rengör Messy HTML-koder med HTML-bricka

    Rengör Messy HTML-koder med HTML-bricka

    Om du redigerar någon annans webbsida eller vill kopiera en kod av en layout kan det vara svårt wading genom formateringen. Du måste städa upp många roddiga områden och det här är inte kul att göra manuellt.

    Med HTML-bricka webbapp, kan du Rensa automatiskt någon HTML-kod med ett knapptryck.

    Denna webbapp tar bort alla externa funktioner ur HTML, inklusive överskridande CSS och JavaScript. Det kommer också band de flesta klasser och attribut att lämna bara HTML-mallarna med bare ben.

    Det här är kanske det mest användbara när studera strukturen på en annan webbplats. Om du vill klona en layout kan du enkelt se källan och kopiera / klistra in koden i din egen editor.

    Du kanske också vill remsa HTML-kommentarer och förenkla koden ytterligare. Det här är HTML-tvättmaskinen som är till nytta.

    Den har en handfull snygga funktioner och dessa är De mest användbara för utvecklare:

    • Konverterar koden till HTML5 (från HTML4 / XHTML)
    • Rättsar felaktigt formaterade taggar
    • Reformats HTML med korrekt indragning
    • Tar bort alla inline skript och CSS

    Observera att HTML-bricka är inte en komplett lösning för överföring av en äldre layout till HTML5. Det är inte heller ett perfekt verktyg för att bokstavligen kopiera / klistra in en befintlig layout och göra den till din egen.

    Men som utgångspunkt kan det här verktyget hjälpa dig städa upp ruttig HTML snabbt. Det hjälper dig fokusera på bara grundläggande koden, så du är inte bogged down av klasser eller externa HTML attribut.

    Även om det finns några taggar har inte alt attribut som denna HTML-bricka lägger till på sidan. Det är meningen att det ska matas ut HTML som är fullt kompatibel med moderna kodnings- och tillgänglighetsstandarder.

    En egenskap som jag skulle vilja se är valfritt införande av klasser eller ID-er. Ibland vill du behålla klasserna så att du kan kopiera / klistra in kod tillsammans med det ursprungliga stilarket för att hålla samma utseende.

    Just nu är det inte möjligt med HTML-bricka, men här hoppas det kan läggas till i en framtida uppdatering!

    För ett automatiserat verktyg är det här bra och det låter dig heller kopiera / klistra in kod eller ladda upp en fil direkt från din dator.

    Till se det leva i aktion, kolla in huvudsidan och ge den en gå. Om det här är något du kan se själv, var noga med att boka det.

    Och om du har några förslag till förbättringar skjuter ett snabbt meddelande till utvecklaren på Twitter @HtmlWasher.