HTML DOM firstElementChild प्रॉपर्टी का उपयोग किसी दिए गए एलिमेंट के पहले चाइल्ड एलिमेंट को वापस करने के लिए किया जाता है। चाइल्ड एलिमेंट को केवल एलिमेंट नोड के रूप में लौटाया जाता है। यह पाठ और टिप्पणी नोड्स को अनदेखा करता है और उन पर विचार नहीं करता है। यह केवल पढ़ने के लिए संपत्ति है।
सिंटैक्स
HTML DOM firstElementChild प्रॉपर्टी का सिंटैक्स निम्नलिखित है -
element.firstElementChild
उदाहरण
आइए हम firstElementChild प्रॉपर्टी के लिए एक उदाहरण देखें -
<!DOCTYPE html> <html> <head> <script> function eleChild() { var ch = document.getElementById("DIV1").firstElementChild.innerHTML; document.getElementById("Sample").innerHTML = "The first element child node of the div is :"+ch; } </script> </body> </html> <h1>firstElementChild property</h1> <div id="DIV1"> <p>This is a p element</p> <span>This is a span element</span> </div> <button onclick="eleChild()">Get Child</button> <p id="Sample"></p> </body> </html>
आउटपुट
यह निम्नलिखित आउटपुट देगा -
"बाल प्राप्त करें" विधि पर क्लिक करने पर -
उपरोक्त उदाहरण में -
हमने एक बटन "गेट चाइल्ड" बनाया है जो उपयोगकर्ता द्वारा क्लिक किए जाने पर eleChild () विधि को निष्पादित करेगा -
<button onclick="eleChild()">Get Child</button>
eleChild () फ़ंक्शन को "DIV1" आईडी के साथ div का firstElementChild मिलता है और इसके आंतरिक HTML गुण को चर ch पर असाइन करता है। चूंकि firstElementChild व्हाइटस्पेस पर विचार नहीं करता है, यह
तत्व लौटाएगा। आंतरिक HTML गुण का उपयोग करके हम
तत्व के अंदर पाठ प्राप्त करते हैं और इसे "नमूना" आईडी के साथ पैराग्राफ में प्रदर्शित करते हैं -
function eleChild() { var ch = document.getElementById("DIV1").firstElementChild.innerHTML; document.getElementById("Sample").innerHTML = "The first element child node of the div is :"+ch; }