§

HTML-ni joylashtiring

§

Xom

§

Ko'rinish

Ko'rinish DOMPurify orqali tozalanadi — script teglar, hodisa ishlovchilar va javascript: URI'lar render qilishdan oldin olib tashlanadi.

Markdown AQSh va Buyuk Britaniyada dasturiy ta'minot hujjatlashtirishning lingua francasiga aylangan. Har bir GitHub README, Stack Overflow javobi va Reddit izohi Markdown tahlilchidan o'tadi, Stack Overflow dagi 100 million dan ortiq dasturchi postlari ishonchli render uchun CommonMarkka tayanadi. AQSh federal laboratoriyalari Markdown manba fayllarini statik hujjat portallariga aylantiruvchi MkDocs va Sphinx quvurlarini boshqaradi, GOV.UK kontent dizaynerlari esa xizmat sahifalarini chop etishdan oldin Markdown da yozadi. Notion, Obsidian va Bear AQSh va Buyuk Britaniyadagi millionlab bilim ishchilariga Markdown birinchi yondashuvi bilan eslatmalar olish imkoniyatini taqdim etadi, Substack nashrnomalari Markdown qoralamalarini HTML elektron pochtalariga kompilyatsiya qiladi. Eksport qilingan HTML ni Markdown ga qaytarib aylantirish ikki bozorda ham texnik yozuvchilar, ochiq manba saqlovchilar va platforma muhandislari uchun kundalik ishdir.

HTML dan Markdown ga konvertatsiya nima?

HTML — brauzer ko'rsatadigan render qilingan belgilash — <h1>, <ul>, <table>, <a> va qolganlar. Markdown — bir xil tuzilmani 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 ni Markdown ga aylantirish render qilingan yoki eksport qilingan HTML ni tahrirlanadigan oddiy matn Markdown ga qaytaradi — CMS dan kontent ko'chirish yoki README ni tozalash uchun aynan kerak bo'lgan narsa.

Chiqish qaysi GitHub Flavored Markdown xususiyatlarini qo'llab-quvvatlaydi?

turndown-plugin-gfm kengaytmasi bilan jamlangan turndown@7.2.0 mexanizmi HTML ingizdan to'liq GFM ustki to'plamini chiqaradi: <h1><h6> dan # dan ###### gacha ATX uslubidagi sarlavhalar, ichiga joylashtirilgan tartibli va tartibsiz ro'yxatlar, qalin **text** va kursiv *text*, <del> dan ustidan chiziq ~~text~~, qatordagi havolalar [text](url) va rasmlar ![alt](src), til maslahatli panjarali kod bloklari (```js), qator ichi kod parchalari `code`, <table> dan quvur jadvallari, checkbox inputlardan GFM vazifa ro'yxatlari - [ ] / - [x], iqtiboslar > va gorizontal chiziqlar ---. Ko'rinish paneli chiqarilgan Markdown ni marked@12.0.2 bilan qayta render qiladi, shunda konvertatsiyani vizual tasdiqlashingiz mumkin.

HTML dan Markdown ga konvertatsiya qanday ishlaydi?

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

  1. Tozalash: joylashtirilgan HTML biror narsa belgilashni aylanib chiqishidan oldin <script> elementlarini, barcha on* hodisa ishlovchilarini va javascript: URI larini olib tashlash uchun avval DOMPurify.sanitize(html, { USE_PROFILES: { html: true } }) dan o'tkaziladi. DOMPurify — Mozilla MDN, Atlassian va Microsoft 365 ishlatadigan o'sha XSS tozalovchisi.
  2. Konvertatsiya: turndownService.turndown tozalangan DOM ni aylanib chiqadi va GitHub Flavored Markdown chiqaradi — sarlavhalar # prefikslariga, ro'yxatlar - / 1. elementlariga, <table> quvur jadvaliga va hokazo aylanadi. Markdown faqat o'qish uchun <textarea> ga value orqali yoziladi (hech qachon innerHTML emas), shuning uchun o'z tabiatiga ko'ra xavfsiz.
  3. Render: chiqarilgan Markdown marked.parse tomonidan qayta tahlil qilinadi, DOMPurify orqali qayta tozalanadi va Markdown kutilgan tuzilmaga qaytishini vizual tasdiqlash uchun ko'rinish panelining innerHTML ga tayinlanadi. Jonli rejim kiritishni 150 ms ga debounce qiladi, shunda joylashtirganda chiqish tahlilchini zo'riqtirmasdan yangilanadi.

Nima uchun HTML ni shu vosita bilan Markdown ga aylantirish kerak?

  • Maxfiylik: har bir tozalash, konvertatsiya va render bosqichi brauzeringizda bajariladi. HTML — eksport qilingan CMS postlari, ichki hujjatlash va maxfiy sahifa manba kodi shu jumladan — serverlarimizga hech qachon yetib bormaydi.
  • Standart XSS-xavfsiz: joylashtirilgan HTML turndown aylanib chiqishidan oldin DOMPurify dan o'tkaziladi va ko'rinish paneli qayta render qilingan HTML ni innerHTML dan oldin yana DOMPurify dan o'tkazadi, shuning uchun <script> teglar yoki onerror= ishlovchilarini o'z ichiga olgan belgilashni joylashtirish inert ko'rinish va toza Markdown hosil qiladi.
  • GFM to'liqlik: <table> elementlari Markdown quvur jadvallariga, <del> ustidan chiziqqa, checkbox ro'yxatlari GFM vazifa ro'yxatlariga aylanadi. Ko'pchilik onlayn konvertorlar HTML → Markdown yo'lida jadvallarni yo'qotadi — jamlangan turndown-plugin-gfm kengaytmasi ularni saqlaydi.

HTML dan Markdown ga konvertatsiyaning keng tarqalgan qo'llanilishlari qanday?

HTML ni Markdown ga aylantirish kontent ko'chirish, hujjatlash va arxivlashda uchraydi:

  • CMS ko'chirishi: WordPress yoki Ghost postini HTML sifatida eksport qilish va Hugo / Jekyll / 11ty / Astro statik sayt qayta qurish uchun Markdown ga o'zgartirish. Konvertatsiya sarlavha darajalarini, havolalarni, ro'yxatlarni va qator ichi urg'uni saqlaydi.
  • README tozalash: viki sahifa yoki veb maqolaning render qilingan HTML ini joylashtirish va loyiha README yoki hujjatlar sayti uchun tahrirlanadigan Markdown ga qaytarish, tuzilmani qo'lda qayta yozish o'rniga.
  • Arxivlash va eslatmalar: HTML elektron pochtasini yoki veb qirqimini ushlash va Obsidian, Notion yoki oddiy matn bilim bazasida saqlash uchun Markdown ga aylantirish — Markdown diff-tushunarli bo'lib qoladi va format o'zgarishlaridan omon chiqadi.

HTML dan Markdown ga misol qanday ko'rinadi?

<h2>Sarlavha</h2><ul><li>a</li><li>b<ul><li>ichiga joylashgan</li></ul></li></ul> ni joylashtirish ## Sarlavha, ichiga joylashtirilgan ro'yxat va xuddi shu joylashgan tuzilishga qayta renderlangan ko'rinish panelini o'z ichiga olgan Markdown hosil qiladi. Sarlavha qatori va ikkita ma'lumot qatori bilan <table> ni joylashtirish ekvivalent | ustun | ustun | quvur jadvalini hosil qiladi — konvertatsiya sarlavhalar, ro'yxatlar va jadvallarni saqlaganligini tasdiqlaydi.

Ushbu HTML dan Markdown ga o'zgartirgich to'liq brauzerimda ishlaydimi?

Ha. Har bir tozalash, konvertatsiya va render bosqichi brauzer ichida JavaScript sifatida lokal tarzda bajariladi. Uchta jamlangan kutubxona — turndown@7.2.0 (turndown-plugin-gfm@1.0.2 bilan), 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. Eksport qilingan postlar, ichki hujjatlar va maxfiy sahifa manba kodi qurilmangizda qoladi.

Render qilingan ko'rinish paneli XSS-xavfsizmi?

Ha. Joylashtirilgan HTML turndown aylanib chiqishidan oldin DOMPurify.sanitize dan o'tkaziladi; ko'rinishning innerHTML ga tayinlanadigan har bir HTML satr ham 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.) va javascript: URI sxemalarini 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 HTML dan konvertatsiya qilinadimi?

Ha. HTML → Markdown yo'nalishi turndown-plugin-gfm dan foydalanadi, u <table> tugunlarini aylanib chiqadigan va ekvivalent quvur-jadval Markdown hosil qiladigan maxsus turndown qoidasini qo'shadi — sarlavha qatori, |---|---| hizalama qatori va keyin ma'lumotlar qatorlari. Ko'pchilik onlayn konvertorlar bu yo'lda jadvallarni yo'qotadi; bu esa saqlaydi. Ustidan chiziq (<del>text</del>~~text~~) va vazifa ro'yxatlari (<input type="checkbox">- [ ] / - [x]) xuddi shunday konvertatsiya qilinadi.

HTML im to'g'ri konvertatsiya qilinadimi?

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 — konvertatsiya toza va oldindan aytib bo'ladigan. Chegara holatlari: HTML izohlari (<!-- ... -->) olib tashlanadi (Markdown da izoh sintaksisi yo'q); qator ichi uslublar va klass atributlari Markdown da ekvivalenti yo'qligi uchun tashlanadi; va <sub> / <sup> kabi kamdan-kam qator ichi teglar oddiy matnga aylantiriladi. Bular hujjatlangan turndown xatti-harakatlari, xato emas.

Panjarali kod bloklarida sintaksisni ajratish qo'llab-quvvatlanadimi?

v1 da yo'q. Panjarali kod bloklari ko'rinishda 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 HTML dan Markdown ga o'zgartirgich turndown@7.2.0 (+ turndown-plugin-gfm@1.0.2), marked@12.0.2 va DOMPurify@3.1.7 bilan bir manbadan jamlangan holda keladi, to'liq GFM xususiyatlar to'plamini chiqaradi 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.