JuanDesk
Mga ToolMga FileMga Converter
FILEN

XML at HTML Formatter

Developer

I-indent o i-minify ang markup nang hindi ginagalaw ang bawal galawin.

Inayos
<article class="post"> <h1> Title </h1> <p> Some <em> markup </em> with a <br> break. </p> <pre> indented code stays</pre> <ul> <li> one </li> <li> two </li> </ul> <!-- a comment --> </article>
16 tag · 0 problema
Mga tag16
Problema0
Mga karakter276
Nag-aayos lang ito; hindi ito nagva-validate. Ang well-formedness ayon sa buong specification — entities, namespaces, doctypes — ay mas malaking pahayag kaysa sa kayang panindigan ng pag-indent ng dokumento. Ang mga sira sa istruktura sa ibaba ang talagang natutukoy nito.
Iniwan nang eksakto ang laman ng pre, textarea, script at style. Bahagi ng nilalaman doon ang whitespace — sinisira ng muling pag-indent ng pre block ang code sample, at nagkakaroon ng espasyo sa unahan ang value ng textarea.
Walang closing tag ang mga void element gaya ng br, img at input, kaya hindi pinapasok ang mga ito sa indent. Kapag itinuring ang isa bilang opening tag, napapalalim nang isang antas ang lahat ng kasunod hanggang dulo ng dokumento — ang pinakakaraniwang pagkakamali ng formatter na gawa-kamay.

Paano gamitin

Para saan ito

Gawing nababasa ulit ang HTML o XML na siksik sa iisang linya, nang may sariling linya at indent ang bawat tag — o paliitin ito — at hanapin ang tag na hindi naisara.

Bago magsimula

Ihanda ang markup: ang code na may mga tag ng web page, email template o data file. Sa browser mo ito inaayos at walang ipinapadala kahit saan.

  1. I-paste ang markup

    Palitan ng sarili mong HTML o XML ang sample sa Markup. Ang markup ay tekstong binubuo ng mga tag sa loob ng angle bracket, gaya ng <p> at </p>.

  2. Piliin ang indent

    Itinatakda ng Indent kung gaano kalalim papasok ang bawat antas: Dalawang espasyo, Apat na espasyo o Tab. Piliin ang gamit ng iba mo pang file; karaniwang pinipili ang dalawang espasyo.

  3. O paliitin na lang

    I-tsek ang Palitan ng pagpapaliit para alisin ang espasyo sa pagitan ng mga tag sa halip na magdagdag, para sa file na program lang ang babasa. Hindi magagamit ang Indent habang naka-tsek ito.

  4. I-format at kopyahin

    Pindutin ang I-format. Nasa band sa itaas ng card ang resulta — nagbabago rin ito habang nagta-type ka — at inilalagay ito ng Kopyahin sa clipboard mo.

  5. Tingnan kung may sirang tag

    Kung lumabas ang Problema sa istruktura sa ibaba, pinangangalanan ng bawat linya ang tag at kung ano ang mali rito. Ginagawa pa rin ang output, kaya makikita mo sa hugis nito kung saan ang mali.

Pagbasa ng resulta

  • Inayos (o Pinaliit): ang markup mo, inilatag ulit. Ang espasyo lang sa pagitan ng mga tag ang nagbabago; nananatili ang mga komento at lahat ng iba pa.
  • Mga tag, Problema at Mga karakter: kung ilang tag ang nakita, ilang sira sa istruktura, at ang haba ng resulta.
  • Hindi naisara: tag na nagbukas at hindi isinara. Walang isinasara: closing tag na walang katugmang opening tag.

Kung may problema

  • Hindi ibig sabihin ng sero problema na valid ang dokumento. Inaayos lang nito ang layout at hinuhuli ang tag na hindi naisara o naligaw — sinasabi iyon ng note sa pahina.
  • Nanatili ang kakaibang espasyo ng code sample: iniiwan nang eksakto ang loob ng pre, textarea, script at style, dahil bahagi ng nilalaman ang espasyo roon.
  • Masyadong nakapasok ang mga linya pagkatapos ng isang mali: tingnan ang unang linyang Hindi naisara. Itinutulak ng tag na naiwang bukas ang mga kasunod nito nang isang antas papasok, hanggang magsara ang tag na nakapaligid dito.

Ano ito

Nagpapaayos ito, hindi nagbe-validate, at nakasulat iyon sa pahina. Ang pagsasabing "valid" dahil lang nagawa nitong i-indent ang dokumento ay pagsasabi ng bagay na hindi nito alam.

May mga elementong bahagi ng nilalaman ang espasyo: ang pre, textarea, script at style. Ang pag-indent ulit sa loob ng pre ay sumisira sa code sample; ang textarea ay nagkakaroon ng espasyo sa unahan ng halaga nito. Hindi ginagalaw ang apat.

Ang void element ay walang pansarang tag. Kapag itinuring na pambukas ang <br>, lahat ng susunod ay lumalalim ng isang antas habambuhay — ito ang pinakakitang-kitang pagkabigo ng sulat-kamay na formatter.

At hindi ito nagpa-parse tungo sa puno. Ang round trip sa puno ay nagtatanggal ng komento, CDATA at kakaibang doctype. Token stream ito: lahat ng pumasok ay lumalabas.

Mga tanong

Pinapatunayan ba nito ang XML o HTML ko?

Hindi, at sinasabi iyon sa pahina. Ang pagpapatunay ay pagsusuri laban sa buong espesipikasyon — entity, DTD, namespace, deklarasyon ng encoding — at ang tool na nag-uulat ng “wasto” dahil nagawa nitong i-indent ang dokumento ay nagsabi sa iyo ng bagay na hindi nito alam. Ang iniuulat nito ay ang iisang uri ng depektong talagang natutuklasan nito: ang tag na hindi nagsasara, at ang saradong tag na walang katugma.

Bakit hindi ginagalaw ang <pre> block ko?

Dahil nilalaman ang espasyo sa loob nito, hindi pormat. Ang pag-indent muli sa pre block ay sumisira sa halimbawang code na nasa loob nito, at ang textarea na ganoon din ang pagtrato ay nagkakaroon ng espasyo sa unahan ng halaga nito. Iniiwan ang script at style sa parehong dahilan. Ang apat na elementong iyon ay dumaraan nang eksakto sa pagkakadating nila.

Bakit may mga formatter na nag-iindent nang mas malalim sa lahat ng kasunod ng <br>?

Dahil itinuturing nila itong pambungad na tag. Ang void element — br, img, input, hr, meta, link at iba pa — ay walang saradong tag sa HTML, kaya walang nagbabalik sa indent palabas, at habang-buhay na gumagapang pakanan ang natitirang dokumento. Ito ang pinakanakikitang paraan ng pagpalya ng kinamay na formatter, at alam ng isang ito ang listahan.

Mawawala ba nito ang komento o doctype ko?

Hindi. Hindi ito nagpaparse patungo sa puno at naglalabas muli, at iyon ang nagbabagsak sa anumang hindi ginaya ng parser — komento, processing instruction, CDATA, hindi pangkaraniwang doctype. Sa daloy ng token ito gumagana: ang bawat token na pumapasok ay lumalabas, at ang espasyo sa pagitan nila lang ang nagbabago. Ang formatter na tahimik na nagbubura ng bahagi ng dokumento ay mas malala kaysa sa isang nag-iiwan ng kakaibang indent.

Bakit may lumalabas pa rin itong output para sa sirang dokumento?

Dahil walang silbi ang pagtanggi sa taong sinusubukang makita kung saan ito nasira. Nakalista ang mga problema at gumagawa pa rin ng inayos na output, kaya makikita mo ang istruktura at matatagpuan ang nawawalang tag. Sinasadya rin na hindi pinapayagang baguhin ng saradong tag na walang katugma ang antas ng indent — kung hindi ay hihilahin ng iisang pagkakamali ang bawat kasunod na linya pakaliwa at magmumukhang maling lahat ang dokumento.

Ipinapadala ba kahit saan ang markup ko?

Hindi. Sa browser mo nangyayari ang lahat at walang ipinapadala o itinatago.

Ang komputasyon

Ano ang hindi ginagalaw
pre, textareaespasyo ang nilalaman
script, styleibang wika sa loob
<!-- komento -->buong-buo
<!DOCTYPE>, CDATAbuong-buo
Ang void element

Ang area, base, br, col, embed, hr, img, input, link, meta, param, source, track, wbr ay walang pansarang tag. Walang magbabalik sa indent papalabas kapag pumasok ito, kaya lahat ng natitirang bahagi ng dokumento ay unti-unting lumilihis pakanan.

Ituloy pa

#56Pang-alis ng HTML TagWhen you want the text without the markupBuksan#43JSON FormatterThe other format that needs tidyingBuksan#48Paghahambing ng TekstoCheck formatting changed nothing elseBuksan#64JSON DiffCompare data rather than textBuksan

Mahalaga

Runs entirely in your browser. This formats rather than validates — well-formedness against the full specification is a larger claim than indenting supports. It reports the structural faults it genuinely detects and still produces output for a broken document. Walang ipinapadala sa mga server namin ang tina-type mo rito — sa browser mo tumatakbo nang buo ang pagkuwenta.