معاينة Markdown أونلاين — عرض مباشر ونسخ HTML
محرر Markdown مباشر مع HTML منظَّف للنسخ أو الحفظ
تعمل في متصفحك · لا يُرفع أي شيء
عند التفعيل يُحفظ نصك في هذا المتصفح فقط ولا يُرسل إلى أي خادم. وإيقاف الخيار يحذف النص المحفوظ.
المعاينة
جارٍ تحميل محرك المعاينة…
يُنظَّف HTML المعاينة دائمًا: تُحذف السكربتات وسمات الأحداث وروابط javascript: والإطارات iframe والنماذج. وإذا احتوى نصك على عناوين صور، يجلبها متصفحك مباشرة من عناوينها.
ما هذه الأداة؟
تعرض معاينة Markdown النتيجة المنسَّقة بجانب نصك أثناء الكتابة. وهي مفيدة لمراجعة ملف README أو مسودة تدوينة أو وثائق برمجية أو محضر اجتماع قبل نشره. تعمل العناوين والقوائم والاقتباسات وكتل الشيفرة، وكذلك امتدادات GitHub Flavored Markdown: الجداول والنص المشطوب وقوائم المهام. ويُنظَّف الناتج دائمًا قبل عرضه، فلصق نص من مصدر مجهول لن يشغّل أي سكربت.
طريقة الاستخدام
- اكتب Markdown أو الصقه في مربع التحرير. يوجد مثال قصير في البداية، ويُفرغه زر المسح.
- تتحدث المعاينة بعد لحظة من توقفك عن الكتابة. تحقق بعينك من محاذاة الجداول والقوائم المتداخلة.
- اضغط «نسخ HTML» لتضع جزء HTML المنظَّف في الحافظة، جاهزًا لمحرر بوضع HTML أو قالب بريد إلكتروني.
- «حفظ .md» ينزّل نصك الأصلي، و«حفظ .html» ينزّل مستند HTML كاملًا مع ورقة أنماط بسيطة. ويُؤخذ اسم الملف من أول عنوان من المستوى الأول.
- لمتابعة العمل لاحقًا فعّل خيار المسودة، فيُحفظ النص في هذا المتصفح فقط.
كيف تعمل؟
- المحلل: مكتبة marked (رخصة MIT) تحوّل النص إلى HTML وفق مواصفات GFM. وكما في المعيار، لا يتحول سطر جديد واحد إلى فاصل سطر إلا إذا انتهى السطر بمسافتين أو تبعه سطر فارغ.
- التنظيف: مكتبة DOMPurify (رخصة Apache-2.0 أو MPL-2.0، مستخدمة هنا بموجب Apache-2.0) تنظّف HTML قبل عرضه. تُحذف وسوم script وiframe وobject وform وstyle، وسمات الأحداث التي تبدأ بـ on، وسمات style، والروابط التي تستخدم عناوين javascript: أو data:.
- الروابط: تُفتح الروابط المتبقية في تبويب جديد مع rel=“noopener noreferrer”.
- مربعات الاختيار: مربعات قوائم المهام معطّلة دائمًا، فالمعاينة للقراءة فقط.
- الصور: تبقى عناوين الصور كما كُتبت، فيطلبها متصفحك مباشرة من خوادمها، ويمكن لتلك الخوادم رؤية الطلب.
- الملفات: ملف .md هو نصك كما هو بترميز UTF-8. وملف .html مستند UTF-8 مع سمة lang وورقة أنماط بسيطة.
أمثلة
| ما تكتبه | ما تحصل عليه |
|---|---|
**عريض** |
عريض |
~~محذوف~~ |
|
- [x] تم |
مربع مؤشَّر تليه كلمة «تم» |
[رابط](https://example.com) |
رابط يُفتح في تبويب جديد |
[click](javascript:alert(1)) |
يُحذف العنوان ويبقى النص فقط |
<script>alert(1)</script> |
لا يعمل شيء |
هكذا يبدو الجدول. النقطتان في الصف الثاني تحددان المحاذاة.
| الصنف | الكمية |
|:---|---:|
| تفاح | 3 |
الأسئلة الشائعة
هل يُرسل نص Markdown إلى خادم؟
لا. يجري العرض والتنظيف كلاهما داخل متصفحك، ولا يُرفع شيء مما تكتبه. ولا يُحفظ النص في هذا المتصفح إلا إذا فعّلت خيار المسودة، وإيقافه يحذفه. والاستثناء الوحيد أنه إذا أشار نصك إلى صورة خارجية، يحمّلها متصفحك مباشرة من عنوانها.
هل سيعمل وسم script إذا كتبته؟
لا. يمر HTML المعروض دائمًا عبر DOMPurify قبل ظهوره، فتُحذف وسوم script وسمات الأحداث مثل onclick وonerror وروابط javascript والإطارات iframe والنماذج ووسوم style. وما تنسخه أو تنزّله من HTML هو النسخة المنظَّفة.
كيف أكتب جدولًا أو قائمة مهام؟
للجدول افصل الأعمدة بالخط العمودي | وضع صفًا من الشرطات تحت صف العناوين. النقطتان في الطرف الأيسر من ذلك الصف تعنيان المحاذاة إلى اليسار، وفي الطرف الأيمن المحاذاة إلى اليمين. ولقائمة المهام ابدأ عنصر القائمة بـ - [ ] أو - [x]، فتعرض المعاينة مربعات اختيار للقراءة فقط. وكلاهما من ميزات GitHub Flavored Markdown.
هل ستبدو النتيجة مثل GitHub أو مدونتي تمامًا؟
تُفسَّر الصياغة بالطريقة نفسها، لكن الخطوط والمسافات والألوان تحددها كل خدمة. استخدم هذه الصفحة للتأكد من أن Markdown يُحلَّل كما قصدت. ولا يتضمن ملف .html المنزَّل إلا ورقة أنماط بسيطة سهلة القراءة.
ما أقصى طول للإدخال؟
حتى 500,000 حرف. بعد ذلك تتوقف المعاينة وتظهر رسالة، فالصق المستندات الطويلة جدًا على أجزاء.