/ / क्लिक करने पर विशिष्ट div की पृष्ठभूमि कैसे बदलें - जावास्क्रिप्ट, HTML, सीएसएस

क्लिक किए जाने पर एक विशिष्ट div की पृष्ठभूमि को कैसे बदलें - जावास्क्रिप्ट, एचटीएमएल, सीएसएस

ध्यान दें: मैं jQuery का उपयोग नहीं करता, इसलिए कृपया मुझे जवाब दें कि यह jQuery का उपयोग कैसे करें।

मेरे पास कई विभाग हैं। मैं यह जानना चाहता हूं कि जावास्क्रिप्ट का उपयोग करने पर क्लिक करने पर मैं इसे कैसे एक्सेस कर सकता हूं और इसका विशिष्ट रंग बदल सकता हूं।

मैं जैसे समाधान की तलाश में नहीं हूं document.getElementsByTagName("div")[0] क्योंकि इसमें प्रत्येक div के लिए एक अलग संख्या में इनपुट की आवश्यकता होती है।

मैं उम्मीद कर रहा था कि इस तरह से एक सरल समाधान था।

<div onClick="change();"><h1>Hi</h1><div>
<div onClick="change();"><h1>Hi</h1><div>
<div onClick="change();"><h1>Hi</h1><div>

<script>
function change(){
this.style.backgroundColor = "red";
}
</script>

उत्तर:

जवाब के लिए 2 № 1

चूंकि आप jQuery सीखना चाहते हैं (या संभवतः, गैर-इनलाइन घटनाओं), विचार करें:

<div onclick="change(this)"><h1>Hi Dave!</h1></div>   <!-- use closing tags -->
<div onclick="change(this)"><h1>Hi Thomas!</h1></div>

function change(elm) {
elm.style.backgroundColor = "red"
}

ध्यान दें कि संदर्भ (this) इनलाइन ईवेंट हैंडलर कोड (जैसा कि विशेषता में निर्दिष्ट है) वह तत्व है जो ईवेंट का लक्ष्य था - इस स्थिति के लिए यह होगा विशिष्ट DIV तत्व जिसे क्लिक किया गया था। हम फिर कॉलबैक फ़ंक्शन में तत्व को पास करते हैं ताकि हम इसे उदारतापूर्वक उपयोग कर सकें।

इसके अलावा, प्रारंभिक मार्कअप में, दिव्य तत्व बंद नहीं थे और घोंसले के शिकार के लिए नेतृत्व किया। सुधार के साथ, ए ऊपर दृष्टिकोण काम करता है कार्य पूरा करने के लिए। (फिडेल कोड को असाइन करता है window.change सीधे, लेकिन यह अन्यथा एक ही अवधारणा है।)


बेशक, jQuery (या एक अलग) उच्च-स्तरीय रूपरेखा सीखना संभवतः बहुत जल्दी भुगतान करेगा। इनलाइन घटना-संचालकों का उपयोग करना .. बहुत "पुराना स्कूल" है।


जवाब के लिए 0 № 2

यह अधिक आसान होगा।

<div onclick="changeColor(this)">Some text!</div>
<p>A paragraph, that will have no change by click</p>

जावास्क्रिप्ट के लिए यह लिखें:

function changeColor(div) {
div.style.backgroundColor = #hexvalue
}

यह की पृष्ठभूमि का रंग बदल जाएगा div और नहीं <p>। आप इस jQuery कोड का उपयोग करके किसी भी तत्व के लिए कोई भी css मान सेट कर सकते हैं।

हालांकि, मेरे लिए jQuery बहुत आसान था! :) लेकिन जैसा आप चाहते हैं।