jQuery के मूल सिंटैक्स में एक चयनकर्ता(सीएसएस-शैली चयनकर्ता) और चयनित तत्वों में हेरफेर करने के तरीकों का उपयोग करना शामिल है। यहां jQuery के कुछ बुनियादी सिंटैक्स उदाहरण दिए गए हैं:
तत्वों का चयन करना
-
HTML टैग नाम के आधार पर तत्वों का चयन करें:
$("tagname")उदाहरण: पृष्ठ पर$("p")सभी तत्वों का चयन करता है ।<p> -
सीएसएस वर्ग द्वारा तत्वों का चयन करें:
$(".classname")उदाहरण:$(".myClass")वर्ग "myClass" के साथ सभी तत्वों का चयन करता है। -
आईडी के आधार पर तत्वों का चयन करें:
$("#idname")उदाहरण:$("#myElement")आईडी "myElement" के साथ तत्व का चयन करता है। -
विशेषता के आधार पर तत्वों का चयन करें:
$("[attribute='value']")उदाहरण: "बटन" पर सेट$("[data-type='button']")विशेषता वाले तत्वों का चयन करता है ।data-type -
चयनों का संयोजन:
$("tagname.classname"),$("#idname .classname"), ...
चयनित तत्वों में हेरफेर करना
-
किसी तत्व की सामग्री को बदलना: उदाहरण: तत्व की HTML सामग्री को आईडी "myElement" के साथ सेट करता है
.html()।.text()$("#myElement").html("New content") -
तत्व विशेषताओं को संशोधित करना:
.attr(),.prop()उदाहरण: सभी तत्वों की विशेषताओं को$("img").attr("src", "newimage.jpg")बदलता है ।src<img> -
किसी तत्व की सीएसएस कक्षाओं में हेरफेर करना:
.addClass(),.removeClass(),.toggleClass()उदाहरण:$("#myElement").addClass("highlight")आईडी "myElement" वाले तत्व में "हाइलाइट" वर्ग जोड़ता है। -
तत्वों को छिपाना/दिखाना:
.hide(),.show(),.toggle()उदाहरण:$(".myClass").hide()वर्ग "myClass" के साथ सभी तत्वों को छुपाता है। -
तत्वों पर घटनाओं को संभालना:
.click(),.hover(),.submit(), ... उदाहरण:$("button").click(function() { ... })एक क्लिक इवेंट हैंडलर को पंजीकृत करता है
तत्वों के संग्रह के साथ कार्य करना
-
एक संग्रह के माध्यम से पुनरावृत्त करना:
.each()उदाहरण: पृष्ठ पर$("li").each(function() { ... })प्रत्येक तत्व पर पुनरावृत्त करना ।<li> -
संग्रह को फ़िल्टर करना: उदाहरण: तत्वों को फ़िल्टर करता है और "myClass" वर्ग वाले तत्वों का चयन करता है
.filter()।.not()$("div").filter(".myClass")<div> -
किसी संग्रह में तत्व सम्मिलित करना:
.append(),.prepend(),.after(),.before()उदाहरण: आईडी "myElement" वाले तत्व में$("#myElement").append("<p>New paragraph</p>")एक नया तत्व जोड़ता है ।<p>
प्रभाव और एनिमेशन
-
फ़ेडइन/फ़ेडआउट प्रभाव निष्पादित करना: उदाहरण:
.fadeIn()1 सेकंड की अवधि में आईडी "myElement" वाले तत्व में फ़ेड।.fadeOut()$("#myElement").fadeIn(1000) -
स्लाइडअप/स्लाइडडाउन प्रभाव निष्पादित करना: उदाहरण:
.slideUp()0.5 सेकंड की अवधि में "myClass" वर्ग के साथ सभी तत्वों को स्लाइड करता है।.slideDown()$(".myClass").slideUp(500) -
कस्टम एनिमेशन निष्पादित करना:
.animate()उदाहरण:$("#myElement").animate({ left: '250px', opacity: '0.5' })तत्व को उसकी बाईं स्थिति और अस्पष्टता को बदलकर आईडी "myElement" के साथ एनिमेट करता है।
ये उदाहरण दर्शाते हैं कि तत्वों का चयन करने, उनके गुणों में हेरफेर करने और प्रभाव या एनिमेशन लागू करने के लिए jQuery के मूल सिंटैक्स के विभिन्न पहलुओं का उपयोग कैसे करें। jQuery वेब विकास कार्यों को सरल बनाने और बढ़ाने के लिए तरीकों और कार्यात्मकताओं का एक समृद्ध सेट प्रदान करता है।