जावास्क्रिप्ट में तत्वों के समूह को प्राप्त करना
पिछले पाठों में हमने विधि
querySelector का उपयोग करके पृष्ठ का
एक तत्व प्राप्त किया था। अब यह सीखने का समय आ गया है कि
तत्वों का एक समूह कैसे प्राप्त करें और
कई तत्वों के साथ एक साथ कुछ ऑपरेशन कैसे करें।
इसके लिए querySelectorAll विधि मौजूद है,
जो सीएसएस सेलेक्टर के अंतर्गत आने वाले सभी टैग्स को
तत्वों की सरणी के रूप में प्राप्त करती है। पाए गए
तत्वों के साथ कुछ करने के लिए,
परिणामी सरणी के साथ काम करना होगा, उदाहरण के लिए,
इसे लूप से पार करें और लूप में प्रत्येक तत्व के साथ
अलग-अलग कोई ऑपरेशन करें।
मान लीजिए, उदाहरण के लिए, हमारे पास कक्षा
www वाले पैराग्राफ दिए गए हैं:
<p class="www">text1</p>
<p class="www">text2</p>
<p class="www">text3</p>
आइए इन पैराग्राफ की एक सरणी प्राप्त करें, उन्हें लूप से पार करें और लूप में पाए गए पैराग्राफ के टेक्स्ट को कंसोल में आउटपुट करें:
let elems = document.querySelectorAll('.www');
for (let elem of elems) {
console.log(elem.textContent);
}
और अब आइए प्रत्येक पैराग्राफ के टेक्स्ट के अंत में एक विस्मयादिबोधक चिह्न जोड़ें:
let elems = document.querySelectorAll('.www');
for (let elem of elems) {
elem.textContent = elem.textContent + '!';
}
पैराग्राफ और एक बटन दिए गए हैं। बटन दबाने पर
सभी पैराग्राफ ढूंढें, उन्हें लूप से पार करें
और प्रत्येक पैराग्राफ का टेक्स्ट मान
'text' पर सेट करें।
टेक्स्ट वाले पैराग्राफ और एक बटन दिए गए हैं। बटन दबाने पर प्रत्येक पैराग्राफ के टेक्स्ट के अंत में उसका क्रमिक नंबर लिखें।
संख्याओं वाले इनपुट, एक पैराग्राफ और एक बटन दिए गए हैं। बटन दबाने पर इनपुट की संख्याओं का योग ज्ञात करें और इस योग को पैराग्राफ के टेक्स्ट में लिखें।
