jQuery for Beginners – Step by Step Tutorial (Part 1)
|
|
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:
-
<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:
-
<a href="#" onclick="alert('jQuery')">Link</a>
Now you can follow next part of jQuery for Beginners Tutorial.
Posted in Java script | 
Tags: Beginners, development, dhtml effects, dom object, functional example, javascript applications, link, Step, tutorial, web programmers
Good Tutorial for beginner
Usefull tutor for Beginners
Nice Start For Beginners
Guys, thanks for creating awesome tutorial for beginners, I have some question. How should I save the jQuery file. in which extension does it work and in which editor I can type it?
Extension is .js . The editor – doesn’t really matter. Notepad will be fine.