जावास्क्रिप्ट में नोड्स के साथ कार्य
जैसा कि आप जानते हैं, टैग में अन्य टैग हो सकते हैं या, जावास्क्रिप्ट की शब्दावली में कहें तो, DOM तत्वों में अन्य DOM तत्व हो सकते हैं। इसके अलावा, हालांकि, उनमें टिप्पणियाँ और साधारण पाठ भी हो सकते हैं। टिप्पणियों, पाठों और DOM तत्वों को एक नाम से जोड़ा जाता है - नोड्स।
आप पहले से ही गुणों firstElementChild,
lastElementChild,
nextElementSibling,
previousElementSibling से परिचित हैं।
ये गुण विशेष रूप से DOM तत्वों के साथ काम करते हैं,
शेष नोड्स को नजरअंदाज करते हुए। एक नियम के रूप में, यही
हमें चाहिए भी होता है।
हालांकि, firstChild,
lastChild, nextSibling, previousSibling गुण भी मौजूद हैं।
ये गुण इसी तरह से काम करते हैं,
हालांकि, सभी नोड्स को ध्यान में रखते हुए। आइए एक उदाहरण पर
इन गुणों के बीच का अंतर देखें।
मान लीजिए कि हमारे पास एक डिव है, जिसमें तीन नोड हैं:
<div id="elem"><!--com-->text<span>tag</span></div>
चलिए इस डिव का लिंक एक वेरिएबल में प्राप्त करते हैं:
let elem = document.querySelector('#elem');
और अब चलिए देखते हैं कि गुणों firstChild और firstElementChild
में क्या है:
console.log(elem.firstChild); // टिप्पणी
console.log(elem.firstElementChild); // स्पैन टैग
ऐसा कोड लिखें जो lastChild और lastElementChild
के बीच का अंतर दिखाए।
ऐसा कोड लिखें जो nextSibling और nextElementSibling
के बीच का अंतर दिखाए।
ऐसा कोड लिखें जो previousSibling और previousElementSibling
के बीच का अंतर दिखाए।