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-*`** — దృశ్యమానత, సూచనలు, భాష మరియు ప్రాప్యత. ## డేటా-* చర్యలో ```html ``` ```js button.dataset.action; // "delete" button.dataset.id; // "7" (always a string) ``` ## ఇది ఎందుకు ముఖ్యమైనది గ్లోబల్ ఆట్రిబ్యూట్‌లు దాదాపు ప్రతిটి మూలకంపై ఉపయోగించే భాగస్వామ్య టూల్‌కిట్ — స్టైలింగ్ మరియు స్క్రిప్టింగ్ కోసం `class`/`id`, JS కు డేటా పంపిణీ చేయడానికి `data-*`, మరియు ప్రాప్యత కోసం `tabindex`/`role`/`aria-*`. వాటిని తెలుసుకోవడం మార్కప్‌ను శుభ్రమైనదిగా మరియు ప్రవర్తనను సమానంగా ఉంచుతుంది.