Markdown HTML o'zgartirgich — Markdown-ni HTML-ga onlayn o'zgartiring _

Markdown-ni HTML-ga konvertatsiya nima?

Markdown — bu strukturali nasrni kodlash uchun minimal tinish belgilarini (sarlavhalar uchun #, urg'u uchun *, ro'yxat elementlari uchun -) ishlatadigan yengil oddiy matn formati. GitHub Flavored Markdown (GFM) asl CommonMark spetsifikatsiyasini jadvallar, ustidan chiziqlar, vazifa ro'yxatlari va avtohavolalar bilan kengaytiradi. HTML — brauzer ko'rsatadigan render qilingan shakl. Markdown-ni HTML-ga aylantirish yengil sintaksisda yozish va render qilingan yuzaga — README, statik sahifa, email tanasi — teglarni qo'lda yozmasdan jo'natish imkonini beradi.

GitHub Flavored Markdown'ning qaysi xususiyatlari qo'llab-quvvatlanadi?

Birga jamlangan marked@12.0.2 tahlilchisi GFM'ning to'liq ustki to'plamini qo'llab-quvvatlaydi: # dan ###### gacha ATX uslubidagi sarlavhalar, ichiga joylashtirilgan tartibli va tartibsiz ro'yxatlar, qalin **text** va kursiv *text*, ustidan chiziq ~~text~~, qatordagi havolalar [text](url) va qatordagi rasmlar ![alt](src), ixtiyoriy til tegi bilan panjarali kod bloklari (```js), qator ichi kod parchalari `code`, sarlavha qatori bilan quvur jadvallari, GFM vazifa ro'yxatlari - [ ] / - [x], iqtiboslar >, gorizontal chiziqlar --- va avtohavolalar. Har bir element ko'rinish panelida GitHub renderlaydigan tartibda ko'rsatiladi.

Markdown-ni HTML-ga konvertatsiya qanday ishlaydi?

Har bir konvertatsiya brauzeringizda lokal tarzda ikkita jamlangan kutubxonadan foydalanib bajariladi — CDN yo'q, fetch yo'q, telemetriya yo'q. Asosiy bosqichlar:

1. Tahlil: marked.parse(source) Markdown-ingizni o'qiydi va HTML satrini hosil qiladi. Parser GFM rejimida ishlaydi; jadvallar, vazifa ro'yxatlari, ustidan chiziqlar va avtohavolalar taniladi.
2. Tozalash: HTML chiqishi innerHTML ga tayinlashdan oldin DOMPurify.sanitize(html, { USE_PROFILES: { html: true } }) orqali o'tkaziladi. DOMPurify — Mozilla MDN, Atlassian va Microsoft 365 ishlatadigan o'sha XSS tozalovchisi — u HTML ni tahlil qiladi, DOM ni aylanib chiqadi va <script> elementlarini, har bir on* hodisa ishlovchi atributini va javascript: URI sxemalarini olib tashlaydi.
3. Render: tozalangan HTML innerHTML orqali ko'rinish paneliga yoziladi; xom HTML esa ikkinchi panelda faqat o'qish uchun <textarea> orqali ko'rsatiladi. Jonli rejim kiritishni 150 ms ga debounce qiladi, shunda ko'rinish tahlilchini zo'riqtirmasdan yozish vaqtida yangilanadi.

Nima uchun Markdown-ni shu vosita bilan HTML-ga o'zgartirish kerak?

• Maxfiylik: har bir tahlil, tozalash va render bosqichi brauzeringizda bajariladi. Markdown — shu jumladan e'lon qilinmagan blog postlari, ichki hujjatlash qoralamalari va maxfiy README mazmuni — serverlarimizga hech qachon yetib bormaydi.
• Standart XSS-xavfsiz: render qilingan ko'rinish paneli har bir HTML satrini innerHTML dan oldin DOMPurify orqali o'tkazadi, shuning uchun Markdown-ingizdagi xom HTML ichidagi <script> teg yoki onerror= ishlovchi inert ko'rinish hosil qiladi. Xom tab tozalanmagan chiqishni tekshirish uchun ko'rsatadi, lekin u value orqali <textarea> ichida turadi — hech qachon ijro etilmaydi.
• GFM to'liqlik: jadvallar, ustidan chiziqlar, vazifa ro'yxatlari va avtohavolalar GitHub renderlaydigan tartibda ko'rsatiladi. Markdown quvur jadvali <thead> va <tbody> bilan HTML <table> ga aylanadi — yo'qolgan satrlar yo'q, tekislangan tuzilish yo'q.

Markdown-ni HTML-ga konvertatsiyaning keng tarqalgan qo'llanilishlari qanday?

Markdown-ni HTML-ga aylantirish hujjatlash, statik sayt ishi va email yozishda uchraydi:

• GitHub README yozish: loyiha README ni lokal tarzda Markdown sifatida qoralash va push qilishdan oldin ko'rib chiqish. Ko'rinish jadvallar, vazifa ro'yxatlari va panjarali kod bloklari uchun GitHub ning GFM render bilan mos keladi.
• Statik sayt kontenti: Markdown postini joylashtirish va markup kutayotgan CMS maydoni yoki shablon dvigateliga HTML olish.
• Email shablonlari: tranzaksiya pochtasi tanasini Markdown sifatida yozish va email xizmati provayderi shablon dvigateli uchun HTML ga o'zgartirish. Chiqish — sof semantik HTML, qator ichi uslublarsiz, email mijoz xususiyatlari ichiga qo'shilmagan.

Markdown-ni HTML-ga o'zgartirish misoli qanday ko'rinadi?

# Title\n\n- item 1\n- item 2\n\n[link](https://example.com) ni joylashtirish <h1>Title</h1>, ikki elementli tartibsiz ro'yxat va <a href="https://example.com">link</a> ni o'z ichiga olgan ko'rinish panelini hosil qiladi. Xom panel aniq HTML satrini ko'rsatadi, uni bevosita shablonga nusxalash mumkin. |---|---| hizalama qatori bilan quvur jadvali <thead> va <tbody> bilan to'liq <table> ga aylanadi — GFM jadvallar GitHub kabi renderlanishini tasdiqlaydi.

Ushbu Markdown HTML o'zgartirgichi to'liq brauzerimda ishlaydimi?

Ha. Har bir tahlil, tozalash va render bosqichi brauzer ichida JavaScript sifatida lokal tarzda bajariladi. Jamlangan kutubxonalar — marked@12.0.2 va DOMPurify@3.1.7 — sahifa bilan bir manbadan jo'natiladi, shuning uchun CDN bog'liqligi yo'q, fetch yo'q, XMLHttpRequest yo'q, kirishda navigator.sendBeacon yo'q. Vosita sahifa yuklangandan keyin oflayn ham ishlaydi, chunki bu sotuvchi kutubxonalar yoniga ko'chirilgan statik HTML/CSS/JS to'plamidir. E'lon qilinmagan postlar, ichki hujjatlar va maxfiy README qurilmangizda qoladi.

Render qilingan ko'rinish paneli XSS-xavfsizmi?

Ha. innerHTML ga tayinlanadigan har bir HTML satr avval DOMPurify.sanitize(html, { USE_PROFILES: { html: true } }) dan o'tadi. DOMPurify — Cure53 tomonidan saqlanadigan ochiq kodli XSS tozalovchisi; bu Mozilla MDN, Atlassian va Microsoft 365 foydalanuvchi tomonidan taqdim etilgan HTML ni kuchaytirish uchun ishlatadigan o'sha kutubxonadir. Standart html profili <script> elementlarini, har bir on* hodisa-ishlovchi atributini (onerror, onclick va h.k.), href / src ichidagi javascript: URI sxemalarini va ma'lum xavfli CSS ifodalarini olib tashlaydi. <img src=x onerror=alert(1)> ni joylashtirish document.querySelector('#output-preview img[onerror]') null qaytaradigan va hech qanday alert ishga tushmaydigan ko'rinish hosil qiladi.

GFM jadvallari qo'llab-quvvatlanadimi?

Ha. Markdown → HTML yo'nalishi quvur jadvallarini marked ning GFM rejimi orqali tabiiy ravishda boshqaradi — |---|---| hizalama qatori bilan ajratilgan sarlavha qatori va undan keyin ma'lumotlar qatorlari <thead> + <tbody> bilan <table> hosil qiladi. Ustidan chiziq (~~text~~ → <del>text</del>) va vazifa ro'yxatlari (- [ ] / - [x] → <input type="checkbox">) GitHub renderlaydigan tartibda ishlaydi.

Markdown'im to'g'ri o'zgartiriladi mi?

Kanonik GFM xususiyatlar to'plami uchun — h1 dan h6 gacha sarlavhalar, ichiga joylashtirilgan tartibli va tartibsiz ro'yxatlar, qalin / kursiv / ustidan chiziq, qator ichi havolalar, qator ichi rasmlar, til teglari bilan panjarali kod bloklari, qator ichi kod parchalari, quvur jadvallar, vazifa ro'yxatlari, iqtiboslar, gorizontal chiziqlar va avtohavolalar — HTML chiqishi barqaror va GitHub renderer bilan mos keladi. Bilinishi kerak bo'lgan ba'zi xatti-harakatlar: Markdown ichidagi xom qator ichi HTML (masalan, <sub>text</sub>) chiqishga o'zgarmasdan o'tadi; CommonMark setext sarlavhalari (=== tagchiziqlar) va ATX sarlavhalari (# Title) har ikkalasi ham bir xil <h1> ni hosil qiladi. Bular hujjatlangan marked xatti-harakatlari, xato emas. Teskari yo'nalish uchun HTML → Markdown vositasidan foydalaning.

Panjarali kod bloklarida sintaksisni ajratish qo'llab-quvvatlanadimi?

v1 da yo'q. Panjarali kod bloklari monoshrift va nozik fon bilan render qilinadi, lekin tilga qarab token ajratishsiz. Sintaksis ajratishni qo'shish Prism yoki highlight.js ni jamlash kerakligini anglatadi, har biri 15–40 KB qo'shadi, shuningdek til uchun grammatika fayli va Workshop Terminal palitrasi bilan moslashtirilishi kerak bo'lgan mavzu matritsasini. Hozircha render to'g'rilik va XSS-xavfsizlikka qaratilgan; agar foydalanuvchilarda qator ichi ajratish talabi bo'lsa, ixtiyoriy almashtirgich amaliy davom etishdir.

Ushbu Markdown HTML o'zgartirgich marked@12.0.2 va DOMPurify@3.1.7 bilan bir manbadan jamlangan holda keladi, to'liq GFM xususiyatlar to'plamini qo'llab-quvvatlaydi va har bir render qilingan HTML satrini DOM ga tegmasdan tozalaydi. Yuklash yo'q, CDN yo'q, telemetriya yo'q — har bir bayt brauzeringizda qoladi.