મફત HTML બ્યુટિફાયર અને મિનિફાયર

આ કેવી રીતે કાર્ય કરે છે

આ ટૂલ પેજમાં જ સીધા બનેલા હાથે લખેલા tag-aware ટોકનાઇઝર વડે HTML ને ફોર્મેટ કે કમ્પ્રેસ કરે છે — કોઈ થર્ડ-પાર્ટી ફોર્મેટિંગ લાઇબ્રેરી નહીં, કોઈ સર્વર રાઉન્ડ-ટ્રિપ નહીં. તમારા markup નો દરેક અક્ષર તમે ટાઈપ કરો કે પેસ્ટ કરો એ જ ક્ષણે સ્થાનિક રીતે બ્રાઉઝરમાં પ્રોસેસ થાય છે.

1. 1
   ટોકનાઇઝર markup સ્કેન કરે છે

   એક કસ્ટમ કેરેક્ટર-બાય-કેરેક્ટર સ્કેનર HTML સ્ટ્રિંગને પસાર કરે છે, comments, DOCTYPE declarations, opening tags, closing tags, self-closing void elements (br, img, input, વગેરે), અને raw text nodes ને ઓળખે છે. એક સમર્પિત helper quoted attribute values ટ્રેક કરે છે જેથી attribute ની અંદરના > (દા.ત. value="a>b") ક્યારેય tag ને વહેલો તોડી ન નાખે.
2. 2
   ઇન્ડેન્ટેશન ડેપ્થ tag-દીઠ ટ્રેક થાય છે

   Beautify મોડ માટે, ટોકનાઇઝર એક depth counter રાખે છે. Block-level opening tags depth વધારે છે; closing tags લખાય તે પહેલાં તેને ઘટાડે છે. Inline elements (span, a, strong, em, વગેરે) તેમના content ની જ લાઇન પર રાખવામાં આવે છે, પોતાની ઇન્ડેન્ટેડ લાઇન પર ધકેલવાને બદલે. pre, script, style, અને textarea જેવા tags ના અંદરના content ને whitespace-સંવેદનશીલ કે executable code બગાડવાનું ટાળવા verbatim emit કરવામાં આવે છે.
3. 3
   Minifier સુરક્ષિત રીતે whitespace ટૂંકાવે છે

   Minify મોડમાં, pre, script, style, અને textarea બ્લોક્સનું content whitespace collapsing શરૂ થાય એ પહેલાં numbered sentinels વડે બદલવામાં આવે છે. HTML comments કાઢી નાખવામાં આવે છે, અને tags વચ્ચેની whitespace ના runs કાઢી નાખવામાં આવે છે — સિવાય કે અડોઅડ inline elements વચ્ચે, જ્યાં શબ્દો ભળી ન જાય એ માટે એક જ સ્પેસ સાચવવામાં આવે છે. Sentinel placeholders પછી તેમના મૂળ content માં પુનઃસ્થાપિત થાય છે.
4. 4
   આઉટપુટ દેખાય છે અને ઓપ્શનલી સેવ થાય છે

   ફોર્મેટ કરેલ કે minify કરેલ પરિણામ કદ-ફેરફારની ટકાવારી સાથે આઉટપુટ પેનલમાં લાઇવ દેખાય છે. તમે તેને ક્લિપબોર્ડમાં કૉપી કરી શકો છો કે .html ફાઇલ તરીકે ડાઉનલોડ કરી શકો છો, બધું બ્રાઉઝર છોડ્યા વગર.

સંબંધિત સાધનો