HTML-তে গ্লোবাল অ্যাট্রিবিউট কী?

Question

Accepted Answer

**গ্লোবাল অ্যাট্রিবিউট** হল এমন অ্যাট্রিবিউট যা আপনি *যেকোনো* HTML এলিমেন্টে রাখতে পারেন, তার ধরন নির্বিশেষে। এগুলি সনাক্তকরণ, স্টাইলিং হুক, অ্যাক্সেসিবিলিটি তথ্য এবং মেটাডেটা প্রদান করে। ```html ``` ## সবচেয়ে বেশি ব্যবহৃত অ্যাট্রিবিউটগুলি - **`id`** — CSS (`#hero`), JS (`getElementById`), এবং পৃষ্ঠার অভ্যন্তরীণ লিঙ্কের জন্য অনন্য অ্যাঙ্কর (`href="#hero"`)। - **`class`** — প্রধান স্টাইলিং/স্ক্রিপটিং হুক; এলিমেন্ট জুড়ে পুনঃব্যবহারযোগ্য। - **`data-*`** — এলিমেন্টের সাথে কাস্টম ডেটা সংযুক্ত করুন, JS-এ `element.dataset` এর মাধ্যমে পড়ুন। - **`tabindex`** — ফোকাসেবিলিটি এবং কীবোর্ড ট্যাব অর্ডার নিয়ন্ত্রণ করুন (`0` = অর্ডার অনুযায়ী ফোকাসেবল, `-1` = শুধুমাত্র স্ক্রিপটের মাধ্যমে ফোকাসেবল)। - **`hidden`**, **`title`**, **`lang`**, **`role`**, **`aria-*`** — দৃশ্যমানতা, টুলটিপ, ভাষা এবং অ্যাক্সেসিবিলিটি। ## data-* কার্যক্রমে ```html ``` ```js button.dataset.action; // "delete" button.dataset.id; // "7" (always a string) ``` ## কেন এটি গুরুত্বপূর্ণ গ্লোবাল অ্যাট্রিবিউটগুলি হল একটি শেয়ার্ড টুলকিট যা আপনি প্রায় প্রতিটি এলিমেন্টে ব্যবহার করেন — স্টাইলিং এবং স্ক্রিপটিংয়ের জন্য `class`/`id`, JS-এ ডেটা পাসিংয়ের জন্য `data-*`, এবং অ্যাক্সেসিবিলিটির জন্য `tabindex`/`role`/`aria-*`। সেগুলি জানা মার্কআপকে পরিষ্কার এবং আচরণকে সামঞ্জস্যপূর্ণ রাখে।