JavaScript
डेटा विशेषताएँ

वाक्य - विन्यास

• var x = HTMLElement.dataset। *;
• HTMLElement.dataset। * = "मान";

टिप्पणियों

डेटा विशेषताओं तक पहुँचना

डेटासेट संपत्ति का उपयोग करना

नई dataset संपत्ति किसी भी तत्व पर data-* डेटा विशेषताओं को पढ़ने (लिखने और लिखने दोनों के लिए) तक पहुँच देती है।

<p>Countries:</p>
<ul>
  <li id="C1" onclick="showDetails(this)" data-id="US" data-dial-code="1">USA</li>
  <li id="C2" onclick="showDetails(this)" data-id="CA" data-dial-code="1">Canada</li>
  <li id="C3" onclick="showDetails(this)" data-id="FF" data-dial-code="3">France</li>
</ul>
<button type="button" onclick="correctDetails()">Correct Country Details</button>
<script>
function showDetails(item) {
    var msg = item.innerHTML
            + "\r\nISO ID: " + item.dataset.id
            + "\r\nDial Code: " + item.dataset.dialCode;
    alert(msg);
}

function correctDetails(item) {
    var item = document.getEmementById("C3");
    item.dataset.id = "FR";
    item.dataset.dialCode = "33";
}
</script>

नोट: dataset प्रॉपर्टी केवल आधुनिक ब्राउज़रों में समर्थित है और यह getAttribute और setAttribute विधियों की तुलना में थोड़ा धीमा है जो सभी ब्राउज़रों द्वारा समर्थित हैं।

GetAttribute और setAttribute विधियों का उपयोग करना

यदि आप HTML5 से पहले पुराने ब्राउज़रों का समर्थन करना चाहते हैं, तो आप getAttribute और setAttribute विधियों का उपयोग कर सकते हैं, जिनका उपयोग डेटा विशेषताओं सहित किसी भी विशेषता तक पहुँचने के लिए किया जाता है। उपरोक्त उदाहरण में दो कार्य इस प्रकार लिखे जा सकते हैं:

<script>
function showDetails(item) {
    var msg = item.innerHTML
            + "\r\nISO ID: " + item.getAttribute("data-id")
            + "\r\nDial Code: " + item.getAttribute("data-dial-code");
    alert(msg);
}

function correctDetails(item) {
    var item = document.getEmementById("C3");
    item.setAttribute("id", "FR");
    item.setAttribute("data-dial-code", "33");
}
</script>