JavaScript में तत्व प्राप्त करने में त्रुटि
कभी-कभी नौसिखिए प्रोग्रामर एक गलती करते हैं,
एक DOM तत्व को प्राप्त करने के लिए
querySelector मेथड के बजाय
querySelectorAll मेथड का उपयोग करके।
आइए इस त्रुटि की विशेषताओं पर नज़र डालें। मान लीजिए एक पैराग्राफ दिया गया है:
<p>text</p>
किसी प्रोग्रामर ने इस पैराग्राफ का पाठ प्राप्त करने और बदलने का फैसला किया। इसके लिए उसने इस तत्व का रेफरेंस एक वेरिएबल में प्राप्त किया, गलती से गलत मेथड का उपयोग करके:
let elem = document.querySelectorAll('p');
फिर प्रोग्रामर ने पैराग्राफ का पाठ बदलने का प्रयास किया। हालाँकि, पैराग्राफ का पाठ नहीं बदला:
elem.textContent = '!!!'; // काम नहीं किया
इसके बावजूद कंसोल में कोई त्रुटि नहीं दिखाई दी। बात यह है कि एक वैध ऑपरेशन किया गया था, लेकिन एक तत्व पर नहीं, बल्कि एक समूह पर। और समूह के पाठ को सीधे पढ़ना या बदलना संभव नहीं है - केवल उन्हें लूप से पुनरावृत्त करके और प्रत्येक तत्व से अलग-अलग संपर्क करके।
त्रुटि कैसे खोजें
आइए देखें कि इस त्रुटि का पता लगाने के लिए एक प्रोग्रामर को कैसे कार्य करना चाहिए। वास्तव में, कुछ अनुभव होने पर, इसकी विशेषताओं के आधार पर इसे आसानी से पहचाना जा सकता है।
हालाँकि, मान लीजिए कि ऐसा नहीं हुआ। तब
त्रुटियों को खोजते समय प्रोग्रामर की पहली कार्रवाई
वेरिएबल्स के मानों को कंसोल में
प्रिंट करना होना चाहिए। उसके मामले में केवल
एक ही वेरिएबल है - elem। इस वेरिएबल का मान
प्रिंट करके देखना होगा कि
इसमें क्या है:
let elem = document.querySelectorAll('p');
console.log(elem); // एक तत्व नहीं, बल्कि एक ऐरे (NodeList) प्रिंट करेगा
कंसोल में तुरंत दिखाई देता है कि वेरिएबल में एक तत्व नहीं, बल्कि एक ऐरे (NodeList) है। यह तुरंत एक स्पष्ट संकेत देता है कि तत्व प्राप्त करने की मेथड में गलती हुई है।