HTML टैग के भीतर एट्रिब्यूट्स से जुड़ी HTML DOM attributes प्रॉपर्टी एक दिए गए नोड के एट्रिब्यूट्स के कलेक्शन को NamedNodeMap प्रकार के ऑब्जेक्ट के रूप में लौटाती है। इन नोड्स को एक्सेस करने के लिए हम इंडेक्स नंबर का उपयोग कर सकते हैं। इंडेक्सिंग 0 से शुरू होती है।
सिंटैक्स
HTML DOM attributes प्रॉपर्टी के लिए निम्नलिखिक सिंटैक्स है -
node.attributes
उदाहरण
आइए attributes प्रॉपर्टी का एक उदाहरण देखें -
<!DOCTYPE html> <html> <body> <p>Click the button the second attribute of the below list</p> <button id="Btn" onclick="attributeFunc()">ATTR NAME</button> <button id="Btn" onclick="attrLength()">ATTR LENGTH</button> <ol id="LIST" type="A" start="5" reversed> <li>ONE</li> <li>TWO</li> <li>THREE</li> </ol> <p id="SAMPLE"></p> <script> function attributeFunc() { var x = document.getElementById("LIST").attributes[2].name; document.getElementById("SAMPLE").innerHTML = x; } function attrLength(){ var x = document.getElementById("LIST").attributes.length; document.getElementById("SAMPLE").innerHTML = x; } </script> </body> </html>
आउटपुट
यह निम्नलिखिक आउटपुट उत्पन्न करेगा -
ATTR NAME बटन पर क्लिक करने के बाद -
ATTR LENGTH बटन पर क्लिक करने के बाद -
उपरोक्त उदाहरण में -
हमने पहले id, type और reversed एट्रिब्यूट के साथ एक ऑर्डर्ड लिस्ट बनाई।
<ol id="LIST" type="A" start="5" reversed> <li>ONE</li> <li>TWO</li> <li>THREE</li> </ol>
फिर हमने attributeFunc() और attrLength() फ़ंक्शन को क्रमशः निष्पादित करने के लिए ATTR NAME और ATTR LENGTH नाम के दो बटन बनाए।
<button id="Btn" onclick="attributeFunc()">ATTR NAME</button> <button id="Btn" onclick="attrLength()">ATTR LENGTH</button>
attributeFunc() फ़ंक्शन इससे जुड़े id “LIST” वाले एलिमेंट को प्राप्त करता है और attributes.name प्रॉपर्टी के साथ इसका दूसरा एट्रिब्यूट नाम प्राप्त करता है। दूसरे इंडेक्स पर एट्रिब्यूट नाम को फिर id “Sample” वाले पैराग्राफ में प्रदर्शित किया जाता है -
function attributeFunc() { var x = document.getElementById("LIST").attributes[2].name; document.getElementById("SAMPLE").innerHTML = x; }
attrLenght() फ़ंक्शन भी इससे जुड़े id “LIST” वाले एलिमेंट को प्राप्त करता है और attributes.length का उपयोग करके उस विशिष्ट एलिमेंट के एट्रिब्यूट्स की संख्या प्राप्त करता है, जो हमारे मामले में 4 लौटाता है। मान 4 को फिर id SAMPLE वाले पैराग्राफ में प्रदर्शित किया जाता है -
function attrLength(){ var x = document.getElementById("LIST").attributes.length; document.getElementById("SAMPLE").innerHTML = x; }
