Menu
CoddyTech

النص داخل HTML

جزء من قسم أساسيات Express في رحلة Node.js على Coddy. الدرس 9 من 23.

يمكن للزائر كتابة أحرف يتعامل معها HTML على أنها ترميز. إذا احتوى العنوان على <b>، فإن وضعه مباشرةً في صفحة ينشئ وسمًا. يحوّل الهروب هذه الأحرف إلى نص يعرضه المتصفح.

escapeHtml('<b>Lunch</b>');
// &lt;b&gt;Lunch&lt;/b&gt;

تحوّل الدالة المساعدة & إلى &amp;، ويعرضه المتصفح على هيئة علامة العطف. وتصبح علامات الاقتباس المزدوجة &quot;؛ أما الفواصل العليا فتبقى كما هي. اهرب كل قيمة نصية تُدرجها، أيًا كان كاتبها، قبل إحاطتها بترميز HTML الخاص بك. سيؤدي الهروب من الصفحة بأكملها إلى عرض وسوم العناوين كنص أيضًا. لا تحتاج إلى كتابة الدالة المساعدة؛ فالقرار المهم هو تحديد موضع استخدامها.

في عنوان URL، اكتب المسافة على هيئة %20، وعلامة العطف على هيئة %26، وعلامتي الزاوية على هيئة %3C و%3E. تفصل هذه الترميزات نص العنوان عن صياغة الاستعلام.

challenge icon

التحدي

سهل

عدّل exercise.js. استخدم الدالة المساعدة المرفقة على العنوان قبل وضعه داخل وسوم العنوان الخاصة بك. أعد العنوان المكتمل في html.

جرّب «العب»: يعيد GET /result?title=Fish%20%26%20Chips القيمة {"html":"<h1>Fish &amp; Chips</h1>"}. جرّب /result?title=%3Cb%3ELunch%3C%2Fb%3E: يجب أن يكون العنوان المُدرج نصًا، بينما يظل العنوان الذي تنشئه ترميزًا.

جرّب بنفسك

import { escapeHtml } from './html.js';
export function exercise({ title }) {
    return { html: `<h1>${title}</h1>` };
}

جميع دروس أساسيات Express

تدرّب بنفسك: Playground لـ Express