jquery is a web scripting language.which is mainly used to show a dynamic interaction in website.jquery is a library written in java script.we have many predefined function in it which helps the java script writter to do their job easier.before getting into jquery you should have a little bit knowlegde in html ,javascript and css.
eg:<!DOCTYPE html>
<head>
<!--css -->
<style>
p { color:blue; margin:8px; }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<input type="submit" value="click"/>
<p></p>
<!--jquery -->
<script>
var val="karthik";
$('input').click(function(){
$("p").text(val);
});
</script>
</body>
</html>
Important usage of jquery.
1.access element in a document.
2.modify the appearance of the web page.
3.alter the content of the document.
4.respond to user interaction.
5.animate changes being made to a document.
6.retrive informationfrom a server without refreshing the page.
7.simply common java script task.
Important note is to use jquery code you have to download the jquery library function.you can download it in (http://jquery.com) else even you can specify the path of the function.by adding this tag in header
script src="http://code.jquery.com/jquery-latest.js"
And even you can specify the jquery function in head tag by using document function
$(document).ready(function(){
// jQuery
});
n number of jquery function can be specified inside the above function.
jquery code start with $ symbol.its a jquery object which is the factory function.
The powerful aspect of jquery is it the ability to make selecting element in DOM easy.
| Selector | CSS | jQuery | Description |
| Tag name | p | $('p') | Selects all paragraphs in the document |
| ID | #some-id | $('#some-id') | Selects the single element in the document that has an ID of some-id |
| Class | .some-class | $('.some-class') | Selects all elements in the document that have a class of some-class |
Shorthand event methods such as this exist for all standard DOM events:
*blur
*change
*click
*dblclick
*error
*focus
*keydown
*keypress
*keyup
*load
*mousedown
*mousemove
*mouseout
*mouseover
*mouseup
*resize
*scroll
*select
*submit
*unload
shortcut method binds a handler to the event with the name.
compound events:
*.ready()
*.toggle()
*.hover()
To know more about events with demo refer(http://api.jquery.com/category/events/)
jquery effects:
The jQuery library provides several effects techniques for adding animation to a web page. and we have so many predefined function for all effects.
*.animate()
*.clearQueue()
*.delay()
*.dequeue()
*.fadeIn()
*.fadeOut()
*.fadeTo()
*.fadeToggle()
*.hide()
*.show()
*.slideDown()
*.slideToggle()
*.slideUp()
*.stop()
*.toggle()
To know more about effects with demo refer (http://api.jquery.com/category/effects/)