إغلاق كافة الوسوم الفارغة | قواعد كتابة JSX وتجميع العناصر عبر Fragment

شرح صفوف ومحتوى الفقرة

الصف 1 شرح توضيحي

تنص القاعدة الثانية في JSX على الإغلاق الصريح لكافة الوسوم بلا استثناء. فبينما يتسامح HTML التقليدي مع ترك العناصر الفارغة مفتوحة، يشترط مترجم JSX إنهاء كل وسم مفرد بشرطة مائلة صريحة مثل <img /> و<input /> و<br /> و<hr /> وإلا توقف التجميع بخطأ نحوي فوري.

الصف 2 كود برمجي

HTML

function WorkspaceShowcase() {
  return (
    <figure className="rx-card">
      <img
        src="/images/examples/studio-workspace.webp"
        alt="Modern workspace"
      />
      <hr />
      <figcaption>Closed void tags.</figcaption>
    </figure>
  );
}

جرّب بنفسك

الصف 3 ملاحظة هامة

Closing All Void Tags إغلاق كافة الوسوم الفارغة

شرح صفوف ومحتوى الفقرة

جميع فقرات هذا الدرس (قواعد كتابة JSX وتجميع العناصر عبر Fragment)