jQuery के द्वारा आप
HTML elements को select (या query -बुला)
कर सकते
है और
उन पर
मनचाहा perform करा सकते है।
jQuery Syntax Examples
$(this).hide()jQuery hide() function को दर्शाता है,, current HTML element को छिपाता (hides) है।
$("#test").hide()
jQuery hide() function को दर्शाता है, id="test" वाले सभी element को छिपाता (hides) है।
$("p").hide()
jQuery hide() function को दर्शाता है, सभी <p> elements (paragraphs) को छिपाता (hides) है।
$(".test").hide()
jQuery hide() function को दर्शाता है, "test" वाले सभी paragraphs को छिपाता (hides) है।
jQuery Syntax
The jQuery syntax is tailor made for selecting HTML elements and perform some action on the element(s).Basic syntax is: $(selector).action()
- यहाँ dollar का चिन्ह jQuery को परिभाषित (define) कर रहा है ।
- (selector)- HTML elements की "query (या find)"करता है।
- यहाँ jQuery action()- वह jQuery action() जो उस element(s) पर उपयोग करता है।
$(this).hide() - current element को छिपाता (hides) है।
$("p").hide() - सभी paragraphs को छिपाता (hides) है।
$("p.test").hide() - class="test" वाले सभी paragraphs को छिपाता (hides) है।
$("#test").hide() - id="test" वाले सभी element को छिपाता (hides) है
|
|
jQuery XPath और
CSS selector syntax के combination का प्रयोग
करता है।
आप selector syntax के बारे में ज्यादा आगे से अध्यायों मे पढेंगे। |
The Document Ready Function
आपने यह notice किया होगा कि, हमारे उदाहरणो मे, सभी jQuery functions,document.ready() function के अंदर होते हैं :|
$(document).ready(function(){
// jQuery functions go here... }); |
यहाँ कुछ उन actions के उदाहरण है जो fail हो जायेंगे अगर functions वेबपेज के पूरी तरह लोड होने से पहले run होते हैं :
- किसी element को छिपाने की कोशिश करना जो अस्तित्व में (exist) ही ना हो
- किसी image के लोड होने से पहले उसकी साइज लेने की कोशिश करना
jQuery को अपने HTML पेज में उपयोग करना
आपको अपने HTML पेज के HEAD टैग के भीतर <script src= में jQuery की फ़ाइल का पूरा पता भरना होता है.
<html>
<head>
<script type="text/javascript" src="path/to/jquery.js"></script>
</head>
<body>
</body>
</html>
<head>
<script type="text/javascript" src="path/to/jquery.js"></script>
</head>
<body>
</body>
</html>
अब अपनी
<body> टैग या <head> टैग के भीतर एक
और <script> टैग जोड़िये.
जैसे:
<html>
<head>
<script type="text/javascript" src="path/to/jquery.js"></script>
</head>
<body>
<script type=”text/javascript”>
</script>
</body>
</html>
<head>
<script type="text/javascript" src="path/to/jquery.js"></script>
</head>
<body>
<script type=”text/javascript”>
</script>
</body>
</html>
अपने <script> टैग में ये लिखें:
$(document).ready(function() {
// do stuff when DOM is ready
});
ये $(document).ready, window.onload के स्थान
पर प्रयोग
किया जाता
है.// do stuff when DOM is ready
});
window.onload तब रन होता है जब आपका पेज पूरी तरह से लोड हो चुका हो. पर अगर आपके पेज में खूब सारे बड़े बड़े चित्र हों तो आपके पेज को लोड होने में भी समय लगेगा और आपका कोड भी देरी से शुरू होगा. जिससे पेज खराब दिख सकता है. अत: इस समस्या को हल करने के लिये jQuery आपको $(document).ready का फ़ंग्शन उपलब्ध कराता है. इससे आपका कोड पेज के तैयार होते ही रन होना शुरू हो जायेगा.
0 comments:
Post a Comment