jQuery Kya Hai ? What is jQuery in Hindi | Features of jQuery Hindi

jquery क्या है ? what is jQuery in hindi

jQuery एक javascript library है | jQuery को बनाया ही गया था javascript का उपयोग आसानी से करने के लिए | इसीलिए jQuery का tagline है “write less do more” | यानि कम code में ज्यादा output |

jQuery का उपयोग client side programming के लिए की जाती है | ये एक कम कोड वाला, light weight और cross browser support करने वाला library है |

javascript से programming को आसान करने के लिए jquery में कई सारे pre-defined functions बनाया गया है |

jQuery की विशेषताएं क्या है ? Features of jQuery

1. jQuery एक open source library है | कोई भी web developer इस library का free में उपयोग website बनाने में कर सकता है |
2. light-weight: jQuery library बहोत ही light weight होती है जो जल्दी server से browser में download हो जाती है | और browser में जल्दी load होकर execute होती है | जिससे फिर website की execution तेज़ होती है |
3. CSS3 complaint: jquery, CSS3 features को support करता है | jquery के जरिये website में css3 style property को आसानी से लगा सकतें हैं |
4. Cross Browser support: jquery library सारे browsers को support करती है | हर web developer को इसी बात की चिंता होती है की उसका website सारे browser में run होगा या नहीं | पर jquery को ऐसे ही बनाया गया की उससे बना website सारे browsers में काम करती है |
5. DOM Traversing: jquery methods के जरिये DOM Elements या HTML Element को run time के समय ढूंड पाना और उसमे जरुरी काम कर पाना आसान हो पाता है | element को ढूँढना या एक element से दुसरे element में move करना को DOM traversing कहा जाता है | each(), eq(), find() ये सब DOM Traversing methods हैं |
6. DOM Manipulation: runtime के समय DOM Structure में jquery method के जरिये बदलाव किया जा सकता है | इसे DOM Manipulation कही जाती है | जैसे html table में नयी row जोड़ना या हटाना एक DOM manipulation का उदाहरण है | append(), remove(), empty(), attr() ये सब jquery DOM Manipulation methods है |
7. jquery Ajax: client side programming में ajax functionality लगाना एक जरुरी काम होता है | jquery ajax method के जरिये webpage में ajax implement करना बहोत आसान होता है |
8. jquery effects: html elements में कुछ अच्छे effects लगाने से वो website और ज्यादा आकर्षित लगती है | jQuery methods के जरिये html में effects लगाके webpage को आकर्षित बनायी जा सकती है |
9. Short Selector: javascript में किसी element को select करने के लिए लम्बी method लिखनी पड़ती थी जैसे किसी element को उसके id के हिसाब से select करना है तो लिखना पड़ता है document.getElementById(“id”) | पर jQuery में उसी element को बहोत छोटे से शब्द से select की जा सकती है जैसे $(“#id”) |

jQuery बहोत छोटे शब्दों वाली selectors देता है जिससे जरुरत के हिसाब से html element को select की जा सकती है |

jQuery सिखने के लिए क्या सीखना जरुरी है ?

jQuery सिखने से पेहले आपको HTML, css और javascript की basic knowledge होनी जरुरी है | HTML किसी भी website की बुनियाद बनाने के लिए जरुरी होता है | इसीलिए html की अच्छी knowledge होनी जरुरी है | ताकि jquery functions को html element के साथ कैसे और कहाँ लगाना है वो समझ में आये |

css से webpage में style दी जाती है | jquery में ऐसे कई function है, जो css के साथ लगाये जाते हैं | इसीलिए css की basic knowledge होना जरुरी है |

jquery, javascript code से ही बना है | इसीलिए javascript की basic knowledge होने से jquery के फायदे और बेहतर तरीके से समझ में आएगा और इसके methods को लगाने में आसानी होगा |

क्या jQuery javascript की replacement है ?

जवाब है नहीं | javascript एक scripting language है | और jQuery एक library जो javascript code से बना है | javascript program को आसान करने के लिए ही jQuery को बनाया गया है | जिससे कम code से ज्यादा काम किया जा सके |

jQuery code कोनसे editor में लिखें ?

सबसे पेहला काम है jquery code लिखने के लिए editor का चुनाब करना | इसके लिए आप कोई भी editor ले सकतें हैं |

आप notepad में ही jquery code html के साथ लिख सकते हैं | अन्य editors हैं:

• notepad++
• sublime
• atom
• VS Code

ये सारे free editors हैं जिसे आप internet से free में download करके jquery code practice कर सकतें हैं |

HTML file में jQuery कैसे लिखें?

html code के साथ jQuery code को लिखने के 3 step होतें हैं |

1. step1 – jQuery file download करना |
2. step2 – jQuery file का link html page में include करना |
3. step 3- jQuery code <script> tag के अन्दर लिखना |

step 1

jQuery file download करने के लिए official site है jquery.com |

इस site के homepage में ही jQuery file download का link मिलेगा |

jQuery file दो तरह के होतें हैं | एक compressed version और दूसरी uncompressed version | compressed version file की size छोटी होती है और इसमें सारे extra space और line को हटा दीया जाता है | इसीलिए jquery code readable नहीं होता |

अगर आपको jquery file को सिर्फ include करके उसका उपयोग करना है तब आप jquery का compressed version download करें |

jquery download links में जिस भी file को, आपको download करना है, उसपे right click करे और “save link as” पे click करें | और उस file को कोई नाम देकर जैसे की jquery.js देकर कर save कर दें |

step 2

अब downloaded jquery file की path का link html page में <head> के अंदर डालना है | इसके लिए <script> tag का उपयोग करना होगा |

<head>
   <title>jQuery Tutorial</title>
   <script src="js/jquery.js"></script>      
 </head>

src attribute में jquery file का link डालना होता है | अब उसके निचे दुसरे <script> tag के अंदर jquery code लिख सकतें हैं |

step 3

उदाहरण:

<html>
 <head>
   <title>jQuery Tutorial</title>
   <script src="js/jquery.js"></script> 
   <script>
    $(document).ready(function(){
	alert("welcome to jQuery tutorial");
	});
   </script>   
 </head>
 <body>
   <h1>Hello</h1>
 </body>
</html>

output:

Implement jquery using CDN

CDN (Content Delivery Network) के प्रयोग से भी jquery, html में लिखी जा सकती है | इससे पेहले के तरीके में jquery file को download करना पड़ता था और उसके पाथ को html page में link करना पड़ता था |

पर CDN में jquery official side से ही jquery की link को html file में डाल सकतें हैं | इससे जब client की request आएगी तब jquery file उसे CDN से मिल जाएगी | और इससे अपने server पे load नहीं पड़ेगा |

बाकि के functionality वैसे ही काम करेगी जैसे पेहले के तरीके में हमने सिखा |

CDN file हमे jquery के official side से मिल जायेगा | जहाँ microsoft, google और अन्य site के CDN link दी गयी है |

उदाहरण में हमने jquery.com की खुदकी CDN link ली है |

उदाहरण:

<html>
 <head>
   <title>jQuery Tutorial</title>
   <script src="https://code.jquery.com/jquery-3.6.0.min.js"
  integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4="
  crossorigin="anonymous">
  </script>
  <script>
    $(document).ready(function(){
	alert("welcome to jQuery tutorial");
	});
  </script>   
 </head>
 <body>
   <h1>Hello</h1>
 </body>
</html>

अन्य CDN links निचे दी जा रही है जिसे आप उपयोग कर सकतें हैं :

• Google CDN – <script src=”https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js”></script>

अन्य jQuery tutorial के सुझाव

• jQuery Selectors
• jQuery Effects
• jQuery Events