jQuery is JavaScript framework, which makes very easy development of JavaScript applications. Moreover jQuery will guaranty you that your application will work on most popular web browsers used today. jQuery makes available many DHTML effects, AJAX requests, DOM modifications, etc. to be used with light source code and rapid development by web programmers.
Main advantages of jQuery is this, that you don't need to add anything to document body, but you can separate all interactivity JavaScript in separate functions in external files. You can see this later in this tutorial.
If you want to make any modification on any DOM object will need to load completely entire document. To be sure this is a true, and without using jQuery you have to write something like this:
jQuery for Beginners - Step by Step Tutorial (Part 1)
|
<body onload="function(...)">
With jQuery we will just use ready event:
$(document).ready(function() {
// do something after full loading of document
});
Now lets make an simple, but fully functional example. Lets say, that you want, after fully load of document to display alert if the visitor click on any link:
$(document).ready(function() {
$("a").click(function() {
alert("jQuery");
});
});
Now lets examine the above code. Like you see, we wait document to be fully loaded with ready event. After document is completely ready for manipulation, selector $("a") selects all a elements.
By using $() in jQuery we initialize new object. Click function, which is standard JavaScript function inserts in selected object (in our case this is all a elements) click event and every time execute this function when click on any link. In other word - jQuery adds to any link, one onClick event like this:
By using $() in jQuery we initialize new object. Click function, which is standard JavaScript function inserts in selected object (in our case this is all a elements) click event and every time execute this function when click on any link. In other word - jQuery adds to any link, one onClick event like this:
<a href="#" onclick="alert('jQuery')">Link</a>
Now you can follow next part of jQuery for Beginners Tutorial.
Next Tutorials
Post Comment
Need a specific tutorial? Do not hesitate and submit a request!
