चीट शीट जेक्वीरी – परिचय
चीट शीट जेक्वीरी, वेब पर कई वेबसाइटें सक्रिय हैं, और बाजार में ऐसी कई श्रेणियां शामिल हैं जो इन वेबसाइटों और ऑनलाइन उत्पादों के निर्माण को पूरा करती हैं। प्रसिद्ध लोगों में से कुछ निम्नानुसार हैं,
- एचटीएमएल, सीएसएस
- क्लाइंट एंड स्क्रिप्टिंग के लिए जावास्क्रिप्ट और जेक्वीरी
- सर्वर अंत स्क्रिप्टिंग के लिए पीएचपी
- डेटाबेस क्वेरीिंग के लिए मायएसक्यूएल
- आदि..
इस चीट शीट जेक्वीरी लेख में, हम चर्चा करेंगे कि जेक्वीरी क्या है और इस फ्रेम्वर्क के पीटीपी।
जेक्वीरी एक क्रॉस-प्लेटफार्म जावास्क्रिप्ट लाइब्रेरी है जो वेब विकास को कोड के लिए आसान बनाने के प्राथमिक उद्देश्य पर लगातार है । यह एक सिद्ध बयान है कि जेक्वीरी की शुरूआत ने जावास्क्रिप्ट कोड की लंबाई को काफी कम कर दिया है। इसलिए एक छोटी रेखा जावास्क्रिप्ट कोड को आसानी से छोटे ब्लॉक या जेक्वीरी कथन की एक पंक्ति के साथ भी हासिल किया जा सकता है।
दूसरों पर जेक्वीरी फ्रेम्वर्क का उपयोग करने के लाभ,
- इसमें एक विशाल समुदाय और इसमें बहुत से प्लगइन शामिल हैं।
- लाइटवेट
- शक्तिशाली चेनिंग क्षमताओं
- संक्षिप्त दस्तावेज़ीकरण और ट्यूटोरियल
- अजाक्स घटकों को आसानी से विकसित करने की क्षमता
- कोड को सरल और पुन: प्रयोज्य बनाने की क्षमता है
- ब्राउज़र अनुकूल
चीट शीट जेक्वीरी की मूल सामग्री और सिंटेक्स :
शामिल करें: वर्तमान निष्पादन स्क्रिप्ट में जेक्वीरी सहित
<head>
<script src=”https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.3.1.min.js”></script>
</head>
वाक्य – विन्यास: जेक्वीरी की संरचना
चयनकर्ता एचटीएमएल घटकों का चयन करें
$(Selector).action() चयनित घटक पर कार्रवाई की गई
जेक्वीरी के उपयोग को परिभाषित करता है
चयनकर्ताओं जेक्वीरी के लिए चीट शीट:
| चयनकर्ता | विवरण |
| $ ( “*”) | सभी एचटीएमएल तत्वों का चयन करता है |
| $ ( ” पी डेमो “) | <पी> टैग तत्वों का चयन करता है |
| $ ( “: बटन”) | बटन और इनपुट तत्वों का चयन करता है |
| $ ( “टीआर: यहां तक कि”) | यहां तक कि <टीआर> टैग तत्वों का चयन करता है |
| $ ( “टीआर: अजीब”) | अजीब <टीआर> टैग तत्वों का चयन करता है |
| $ ( “अवधि: माता-पिता”) | उन तत्वों का चयन करता है जिनमें बाल तत्व संबद्ध है |
| $ ( “[Href]”) | Href विशेषताओं वाले सभी तत्वों का चयन करता है |
| $ ( “: इनपुट”) | सभी फॉर्म तत्वों का चयन करता है |
घटनाओं जेक्वीरी के लिए चीट शीट : घटना वेबपृष्ठ पर कुछ प्रकार की कार्रवाई है, इसमें शामिल प्रमुख कार्यक्रमों का पालन किया जाता है।
| माउस घटनाक्रम | माउस इवेंट विधि | कीबोर्ड इवेंट | कीबोर्ड इवेंट विधि | फॉर्म इवेंट | फॉर्म इवेंट विधि |
| माउसएंटर | .माउसएंटर () | कीप्रेस | ।कीप्रेस() | परिवर्तन | ।परिवर्तन() |
| डबल क्लिक | .डबल क्लिक () | कीडाउन | ।कीडाउन() | फोकस | .फोकस () |
| क्लिक | .क्लिक () | तनाव के स्थिति में | ।तनाव के स्थिति में() | ब्लर | .ब्लर () |
| माउसलीव | .माउसलीव () | ब्राउज़र इवेंट | ब्राउज़र इवेंट विधि | दस्तावेज़ घटनाक्रम | दस्तावेज़ घटना विधियों |
| माउसडाउन | ।माउसडाउन() | त्रुटि आबादी | .त्रुटि () | अनलोड | .अनलोड () |
| माउसअप | .माउसअप () | स्क्रॉल | .स्क्रॉल () | लोड | ।लोड() |
पूर्व:
$(“p”).dblclick(function(){
$(this).hide();
});
चीट शीट जेक्वीरी प्रभाव:
मूल बातें: .हाइड (), .शो (), .टॉगल () – चयनित तत्वों को छिपाने, दिखाने और टॉगल करने की अनुमति देता है।
उदाहरण के लिए:
$(“p”).hide();
कस्टम: .एनिमेट (), .डीलेय (), .dequeue (), .स्टॉप ()
- एनिमेट () विधि कस्टम एनिमेशन तैयार करता है
- देरी () विधि वस्तुओं के देरी निष्पादन की अनुमति देता है।
- dequeue () कतार में मौजूद कार्यों के अगले अनुक्रम निष्पादित करें।
पूर्व:
$(“element1”).animate(
{
opacity : 0.50
left: “+=27”
}
फीका: फेडटू (), फेडआउट (), फेडइन (), फेडटॉगल ()
- फेडइन () एक छिपा तत्व फेड
- फेडआउट () एक दृश्य तत्व को फीका करने की अनुमति देता है
- फेडटू () किसी दिए गए अस्पष्टता के लिए फेडs
- फेडटॉगल () तत्व को फीका और फेड आउट विधियों के साथ टॉगल करने की अनुमति देता है।
पूर्व:
$(“button”).click(function()
{
$(“#div2”).fadeOut(“slow”);
});
स्लाइड: स्लाइडडाउन (), स्लाइडअप (), स्लाइड टॉगल ()
- स्लाइडडाउन () एक स्लाइडिंग गति ओवरमॅच्ड तत्वों के साथ प्रदर्शित करें
- स्लाइडटॉगल () एक स्लाइडिंग गति ओवरमॅच्ड तत्वों के साथ प्रदर्शित या छुपाता है
- स्लाइडअप () एक स्लाइडिंग गति ओवरमॅच्ड तत्वों के साथ छुपाएं
चीट शीट जेक्वीरी का उपयोग करने के लिए मुफ्त युक्तियाँ और चालें
1) एक संदर्भ पैरामीटर रखें जो निष्पादन को जड़ से आक्रमण की बजाय गहरी डॉम शाखा से शुरू करने की अनुमति देता है।
2) जांचें कि तत्व मौजूद है या नहीं और फिर कोड के निष्पादन के लिए आगे बढ़ें।
वाक्य – विन्यास:
if($(“#element”).length)
{
// DOM element exists
}
else
{
//DOM element dont exists
}
3) जेक्वीरी डेटा विधि डोम को संशोधित किए बिना डीओएम तत्वों और डेटा को बांधती है।
4) सत्यापित करें कि कोई भी तत्व छुपा हुआ है या नहीं।
पूर्व:
if($(element).is(“:visible”) == “true”)
{
//The element is Visible
}
5) तत्काल पूर्ववर्ती बाल तत्वों की गिनती रखें।
6) छवियों को लोड करना क्वेरी निष्पादन के प्रदर्शन को अनुकूलित करता है।
7) यह जांचना बेहतर है कि क्वेरी को निष्पादित करने से पहले सफलतापूर्वक लोड किया गया है।
उदाहरण के लिए:
if (typeof jQuery == ‘undefined’)
{
console.log(‘jQuery not loaded’);
}
else
{
console.log(‘jQuery loaded’);
}
8) टूटे हुए छवि लिंक को नीचे दिए गए कोड को ले कर आसानी से बदला जा सकता है,
उदाहरण के लिए:
$(‘img’).on(‘error’, function ()
{
if(!$(this).hasClass(‘broken-image’))
{
$(this).prop(‘src’, ‘img/broken.png’).addClass(‘broken-image’);
}
});
9) फ्रेम हमेशा पृष्ठ की सामग्री फिट करने के लिए सुनिश्चित किया जाना चाहिए।
10) स्वयं चयन फिल्टर जेक्वीरी में जोड़ा जा सकता है। जैसा कि लाइब्रेरी चयन फ़िल्टर में सबकुछ भी अनुकूलित किया जा सकता है। $ .expr [‘:’] ऑब्जेक्ट को जोड़ने से यह किया जाएगा।
पूर्व:
(function($)
{
var random = 0
$.expr[‘:’].random = function(a, i, m, r)
{
if (i == 0)
{
random = Math.floor(Math.random() * r.length);
}
return i == random;
};
})(jQuery);
// how to utilize this piece of code.
$(‘li:random’).addClass(‘glow’);
11) इनपुट में अक्षम विशेषता जोड़ने से इनपुट फ़ील्ड को कुछ सापेक्ष फ़ील्ड भरने तक अक्षम कर दिया जाता है।
उदाहरण के लिए:
$(‘input[type=”submit”]’).prop(‘disabled’, true);
12) एजेएएक्स त्रुटि रिटर्न को संभालने के लिए त्रुटि हैंडलर अनुभाग को परिभाषित करना सुनिश्चित करें। जब एक 400 या 500 त्रुटि मारा जाता है तो यह खंड स्वचालित रूप से ट्रिगर हो जाएगा।
उदाहरण के लिए:
$(document).on(‘ajaxError’, function (e, xhr, settings, error)
{
console.log(error);
});
निष्कर्ष
जेक्वीरी अतिरिक्त जटिलता को कम करता है जो जावास्क्रिप्ट इसके साथ रखता है। जेक्वीरी से जुड़े कई इकाइयों के साथ बाजार में शीर्ष वेबपृष्ठ विकास उपकरण के बीच खड़ा है। इसकी हल्के और कुशल श्रृंखला क्षमताओं ने डेवलपर्स के लिए आसानी से वेब कोडिंग की है।
अनुशंसित आलेख
यह चीट शीट जेक्वीरी के लिए एक मार्गदर्शक रहा है, यहां हमने सामग्री और आदेश के साथ-साथ मुफ्त टिप्स और चीट शीट जेक्वीरी की चाल पर चर्चा की है आप अधिक जानने के लिए निम्न आलेख को भी देख सकते हैं –
- जेक्वीरी साक्षात्कार प्रश्न
- सी ++ के लिए चीट शीट
- एसक्यूएल के लिए चीट शीट
- जावास्क्रिप्ट बनाम जेक्वीरी
