HTML Can Do That: ميزات ديناميكية لم تعد بحاجة إلى JavaScript

استوعب HTML جزءًا كبيرًا من العمل الذي كان يومًا من اختصاص JavaScript، وتجمع صفحة المطوّر كريس بيرنيل الأدلة في مكان واحد. تسرد «HTML Can Do That» ميزات المتصفحات التي توفّر سلوكًا ديناميكيًا بالتوصيف وحده، ولكل ميزة عرض تجريبي ورابط إلى بيانات الدعم في المتصفحات.

ماذا تعرض الصفحة

تشمل القائمة سمة popover التي تمنح العنصر إغلاقًا بالنقر خارجها، وإغلاقًا بمفتاح Escape، ووضعًا في الطبقة العليا دون التعامل مع z-index؛ وعنصر dialog للنوافذ الحوارية، ويمكن فتحه وإغلاقه من HTML مباشرة عبر popovertarget وform method="dialog"؛ وعناصر details المجمّعة، حيث تحوّل سمة name المشتركة عدة عناصر قابلة للفتح إلى أكورديون حصري. وتتيح أوامر invoker ‏(command وcommandfor) لأزرار منفصلة التحكم بنافذة popover واحدة دون سكربتات. أما الصور فتؤجّل التحميل عبر loading="lazy"، ويخفي hidden="until-found" قسمًا يكشفه المتصفح عند وصول رابط مقطعي إليه.

تحفّظات صريحة

يقول بيرنيل بوضوح إن تطبيقات المتصفحات غير متساوية. فعناصر النماذج المدمجة — منتقيات اللون والتاريخ والنطاق، وmeter وprogress — تختلف اختلافًا كبيرًا في التنسيق الافتراضي بين المتصفحات وقد تكون سيئة من حيث الوصول، لذا ينصح بالحذر. أما دعم datalist، الذي يقدّم إكمالًا تلقائيًا مدمجًا دون مكتبة قوائم منسدلة، فلا يزال «متفاوتًا إلى حد كبير» بين أنواع الحقول، ويوجّه الكاتب القراء إلى كتابات أدريان روزيللي عن قوائم الاختيار «ناقصة الهندسة». وتعمل سمة until-found مع بحث المتصفح الداخلي، لا مع بحث قارئات الشاشة.

لماذا يهم ذلك

بدأت الصفحة كعمل ساعة واحدة خلال HTML Day 2026، ثم حُرّرت لاحقًا للإشارة إلى مواضع قصور التطبيقات، مع ملاحظة بأن كل ما يُبنى بهذه الطريقة يجب أن يكون «قابلًا للوصول قدر الإمكان». والخلاصة العملية للمطورين هي مساحة JavaScript أصغر: حالة أقل لإدارتها في الطبقات العلوية والأكورديونات والحوارات والوسائط المؤجلة — شرط فحص مقايضات الوصول في الميزات الجديدة لا افتراضها.