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) מאפשרות לכפתורים נפרדים לשלוט בפופובר אחד בלי סקריפטים. תמונות מקבלות טעינה נדחית עם loading="lazy", ו-hidden="until-found" מסתיר אזור שהדפדפן חושף כשקישור קטע מצביע עליו.

הסתייגויות גלויות

ברנל אומר במפורש שהמימושים בדפדפנים אינם אחידים. רכיבי טופס מובנים — בוררי צבע, תאריך וטווח, meter ו-progress — שונים מאוד בעיצוב ברירת המחדל בין דפדפנים ועלולים להיות גרועים מבחינת נגישות, ולכן הוא ממליץ לנהוג בזהירות. התמיכה ב-datalist, שמציע השלמה אוטומטית מובנית בלי ספריית רשימות, "עדיין די חלקית" בסוגי שדות שונים, והוא מפנה לכתיבה של אדריאן רוזלי על תיבות שילוב "תת-מהונדסות". מאפיין until-found, לעומתם, עובד עם חיפוש הדפדפן עצמו אך לא עם חיפוש בקוראי מסך.

למה זה חשוב

העמוד נבנה בשעה אחת במסגרת HTML Day 2026 ועודכן מאוחר יותר כדי לסמן היכן המימושים לוקים בחסר, עם הערה שכל דבר שנבנה כך צריך להיות "נגיש ככל האפשר". המסקנה המעשית למפתחים היא שטח JavaScript קטן יותר: פחות מצב לניהול בשכבות מעל, באקורדיונים, בדיאלוגים ובמדיה נטענת — בתנאי שבודקים את מחירי הנגישות של התכונות החדשות ולא מניחים אותם.