HTML से Markdown कनवर्टर — ऑनलाइन HTML को Markdown में बदलें _

HTML से Markdown रूपांतरण क्या है?

HTML वह रेंडर ट्रिब्यूशन है जिसे ब्राउज़र दिखाता है — <h1>, <ul>, <table>, <a>, और बाकी। Markdown एक हल्का सादा-पाठ प्रारूप है जो न्यूनतम विराम चिह्नों (# शीर्षक के लिए, * ज़ोर के लिए, - सूची आइटम के लिए) से उसी संरचना को एन्कोड करता है। GitHub Flavored Markdown (GFM) मूल CommonMark स्पेसिफिकेशन को तालिकाओं, स्ट्राइकथ्रू, टास्क लिस्ट और ऑटोलिंक्स के साथ विस्तारित करता है। HTML को Markdown में बदलना रेंडर किए हुए या निर्यात किए गए HTML को संपादन-योग्य सादा-पाठ Markdown में वापस लाता है — यही CMS से कंटेंट माइग्रेशन या README की सफाई के लिए चाहिए।

आउटपुट में कौन-सी GitHub Flavored Markdown विशेषताएँ समर्थित हैं?

संलग्न turndown@7.2.0 इंजन turndown-plugin-gfm एक्सटेंशन के साथ आपके HTML से पूरा GFM सुपरसेट उत्सर्जित करता है: <h1>–<h6> से ATX-शैली शीर्षक # से ###### तक, नेस्टिंग के साथ क्रमित और अक्रमित सूचियाँ, बोल्ड **text** और इटैलिक *text*, <del> से स्ट्राइकथ्रू ~~text~~, इनलाइन लिंक [text](url) और इमेज ![alt](src), भाषा संकेत के साथ फेंस्ड कोड ब्लॉक (```js), इनलाइन कोड `code`, <table> से पाइप तालिकाएँ, checkbox इनपुट से GFM टास्क लिस्ट - [ ] / - [x], उद्धरण >, और क्षैतिज रेखाएँ ---। प्रीव्यू पैनल उत्सर्जित Markdown को marked@12.0.2 से पुनः रेंडर करता है ताकि रूपांतरण की दृश्य पुष्टि हो।

HTML से Markdown रूपांतरण कैसे काम करता है?

हर रूपांतरण आपके ब्राउज़र में तीन संलग्न लाइब्रेरीज़ के साथ स्थानीय रूप से चलता है — कोई CDN नहीं, कोई fetch नहीं, कोई टेलीमेट्री नहीं। मुख्य चरण:

1. शोधन: पेस्ट किया गया HTML पहले DOMPurify.sanitize(html, { USE_PROFILES: { html: true } }) से गुज़रता है ताकि <script> तत्व, सभी on* इवेंट हैंडलर, और javascript: URI ट्रिब्यूशन के किसी भी कोड के चलने से पहले हट जाएँ। DOMPurify वही XSS शोधक है जिसे Mozilla MDN, Atlassian और Microsoft 365 उपयोग करते हैं।
2. रूपांतरण: turndownService.turndown साफ़ DOM को घूमकर GitHub Flavored Markdown उत्सर्जित करता है — शीर्षक # उपसर्ग बनते हैं, सूचियाँ - / 1. आइटम बनती हैं, <table> पाइप तालिका बनती है, आदि। Markdown को value के ज़रिए read-only <textarea> में लिखा जाता है (कभी innerHTML नहीं), इसलिए यह स्वाभाविक रूप से सुरक्षित है।
3. रेंडर: उत्सर्जित Markdown को marked.parse से फिर पार्स किया जाता है, DOMPurify से पुनः शोधित किया जाता है, और प्रीव्यू पैनल के innerHTML को सौंपा जाता है ताकि दृश्य पुष्टि मिले। लाइव मोड इनपुट को 150 ms के लिए डिबाउंस करता है, जिससे पेस्ट करते समय आउटपुट पार्सर पर बोझ डाले बिना अपडेट होता है।

इस टूल से HTML को Markdown में क्यों बदलें?

• गोपनीयता: हर शोधन, रूपांतरण और रेंडर पास आपके ब्राउज़र में होता है। HTML — निर्यात की गई CMS पोस्ट, आंतरिक दस्तावेज़ीकरण, और गोपनीय पेज सोर्स सहित — हमारे सर्वर तक कभी नहीं पहुँचता।
• डिफ़ॉल्ट रूप से XSS-सुरक्षित: पेस्ट किया गया HTML turndown के चलने से पहले DOMPurify से गुज़रता है, और प्रीव्यू पैनल innerHTML से पहले हर HTML स्ट्रिंग को फिर DOMPurify से चलाता है, इसलिए <script> टैग या onerror= हैंडलर वाला HTML पेस्ट करने पर भी निष्क्रिय प्रीव्यू और साफ़ Markdown मिलता है।
• GFM-पूर्ण: <table> तत्व Markdown पाइप तालिकाओं में बदलते हैं, <del> स्ट्राइकथ्रू में, और checkbox सूचियाँ GFM टास्क लिस्ट में। अधिकांश ऑनलाइन कनवर्टर HTML → Markdown पथ पर तालिकाएँ खो देते हैं — संलग्न turndown-plugin-gfm एक्सटेंशन उन्हें संरक्षित रखता है।

HTML से Markdown रूपांतरण के सामान्य अनुप्रयोग क्या हैं?

HTML को Markdown में बदलना कंटेंट माइग्रेशन, दस्तावेज़ीकरण और अभिलेखीकरण में दिखाई देता है:

• CMS माइग्रेशन: WordPress या Ghost की पोस्ट को HTML के रूप में निर्यात करके Hugo / Jekyll / 11ty / Astro स्थिर-साइट पुनर्निर्माण के लिए Markdown में बदलना। रूपांतरण शीर्षक स्तर, लिंक, सूचियाँ और इनलाइन ज़ोर बनाए रखता है।
• README सफाई: किसी विकी पेज या वेब लेख का रेंडर HTML पेस्ट करके उसे प्रोजेक्ट README या डॉक्स साइट के लिए संपादन-योग्य Markdown में वापस लाना, बजाय संरचना को हाथ से फिर से टाइप करने के।
• अभिलेखीकरण और नोट्स: HTML ईमेल या वेब क्लिपिंग को कैप्चर करके Obsidian, Notion, या सादे-पाठ ज्ञान आधार में भंडारण के लिए Markdown में बदलना — Markdown फ़र्क के अनुकूल रहता है और प्रारूप परिवर्तन से बचता है।

HTML से Markdown उदाहरण कैसा दिखता है?

<h2>Heading</h2><ul><li>a</li><li>b<ul><li>nested</li></ul></li></ul> पेस्ट करने पर ## Heading के साथ Markdown, एक नेस्टेड बुलेट सूची, और एक प्रीव्यू पैनल मिलता है जो उसी नेस्टेड संरचना में पुनः रेंडर होता है। हेडर पंक्ति और दो डेटा पंक्तियों के साथ <table> पेस्ट करने पर समकक्ष | col | col | पाइप तालिका मिलती है — जिससे यह सिद्ध होता है कि रूपांतरण शीर्षक, सूचियाँ और तालिकाएँ संरक्षित रखता है।

क्या यह HTML से Markdown कनवर्टर पूरी तरह से मेरे ब्राउज़र में चलता है?

हाँ। हर शोधन, रूपांतरण और रेंडर पास आपके ब्राउज़र टैब के अंदर JavaScript के रूप में स्थानीय रूप से चलता है। तीन संलग्न लाइब्रेरीज़ — turndown@7.2.0 (साथ में turndown-plugin-gfm@1.0.2), marked@12.0.2, और DOMPurify@3.1.7 — पृष्ठ के समान मूल से लोड होती हैं, इसलिए कोई CDN निर्भरता नहीं, कोई fetch नहीं, कोई XMLHttpRequest नहीं, इनपुट पर कोई navigator.sendBeacon नहीं। यह ऑफ़लाइन भी काम करता है। निर्यात पोस्ट, आंतरिक दस्तावेज़ और गोपनीय README आपके डिवाइस पर ही रहते हैं।

क्या रेंडर प्रीव्यू पैनल XSS-सुरक्षित है?

हाँ। पेस्ट किया गया HTML DOMPurify.sanitize से गुज़रता है इससे पहले कि turndown उसे घूमे, और innerHTML को सौंपी गई हर HTML स्ट्रिंग पहले DOMPurify.sanitize(html, { USE_PROFILES: { html: true } }) से गुज़रती है। DOMPurify Cure53 द्वारा बनाए गए ओपन-सोर्स XSS शोधक है; यही लाइब्रेरी Mozilla MDN, Atlassian और Microsoft 365 उपयोगकर्ता-प्रदत्त HTML को कठोर बनाने के लिए उपयोग करते हैं। डिफ़ॉल्ट html प्रोफ़ाइल <script> तत्व, सभी on* इवेंट-हैंडलर एट्रिब्यूट्स (onerror, onclick आदि), javascript: URI योजनाएँ, और ज्ञात-खतरनाक CSS अभिव्यक्तियाँ हटा देती है। <img src=x onerror=alert(1)> पेस्ट करने पर ऐसा प्रीव्यू बनता है जहाँ document.querySelector('#output-preview img[onerror]') null लौटाता है और कोई अलर्ट नहीं चलता।

क्या GFM तालिकाएँ HTML से रूपांतरित होती हैं?

हाँ। HTML → Markdown दिशा turndown-plugin-gfm का उपयोग करती है, जो <table> नोड्स को घूमकर समकक्ष पाइप-तालिका Markdown उत्सर्जित करने के लिए कस्टम turndown नियम जोड़ती है — एक हेडर पंक्ति, एक |---|---| संरेखण पंक्ति, फिर डेटा पंक्तियाँ। अधिकांश ऑनलाइन कनवर्टर इस पथ पर तालिकाएँ खो देते हैं — यह उन्हें संरक्षित रखता है। स्ट्राइकथ्रू (<del>text</del> → ~~text~~) और टास्क लिस्ट (<input type="checkbox"> → - [ ] / - [x]) उसी तरह रूपांतरित होती हैं।

क्या मेरा HTML साफ़ रूपांतरित होगा?

मानक GFM विशेषता-सेट के लिए — h1 से h6 तक शीर्षक, नेस्टिंग के साथ क्रमित और अक्रमित सूचियाँ, बोल्ड / इटैलिक / स्ट्राइकथ्रू, इनलाइन लिंक, इनलाइन इमेज, भाषा टैग वाले फेंस्ड कोड ब्लॉक, इनलाइन कोड, पाइप तालिकाएँ, टास्क लिस्ट, उद्धरण, क्षैतिज रेखाएँ, और ऑटोलिंक्स — रूपांतरण साफ़ और अनुमानित है। एज केस: HTML टिप्पणियाँ (<!-- ... -->) हट जाती हैं (Markdown में टिप्पणी सिंटैक्स नहीं है); इनलाइन स्टाइलिंग और class एट्रिब्यूट हट जाते हैं क्योंकि Markdown में कोई समकक्ष नहीं है; और असामान्य इनलाइन टैग जैसे <sub> / <sup> सादे पाठ में बदल जाते हैं। ये turndown के दस्तावेज़ीकृत व्यवहार हैं, बग नहीं।

क्या फेंस्ड कोड ब्लॉक में सिंटैक्स हाइलाइटिंग समर्थित है?

v1 में नहीं। फेंस्ड कोड ब्लॉक मोनोस्पेस फ़ॉन्ट और हल्की पृष्ठभूमि के साथ रेंडर होते हैं, पर भाषा-विशिष्ट टोकन हाइलाइटिंग के बिना। सिंटैक्स हाइलाइटिंग जोड़ने के लिए Prism या highlight.js को बंडल करना होगा, जिनमें से प्रत्येक 15–40 KB जोड़ता है। फ़िलहाल रेंडरर शुद्धता और XSS-सुरक्षा पर केंद्रित है; यदि इनलाइन हाइलाइटिंग के लिए उपयोगकर्ता माँग हो, तो ऑप्ट-इन टॉगल एक व्यावहारिक अगला कदम है।

यह HTML से Markdown कनवर्टर समान मूल पर turndown@7.2.0 (+ turndown-plugin-gfm@1.0.2), marked@12.0.2, और DOMPurify@3.1.7 के साथ आता है, पूरा GFM विशेषता-सेट उत्सर्जित करता है, और रेंडर किए गए हर HTML स्ट्रिंग को DOM तक पहुँचने से पहले शोधित करता है। कोई अपलोड नहीं, कोई CDN नहीं, कोई टेलीमेट्री नहीं — हर बाइट आपके ब्राउज़र में ही रहता है।