Tuesday, 28 August 2012

Jquery Tutorial for absolute beginners

Please understand, this tutorial is for absolute beginners and its pretty much straightforward and presented with some really basic jquery syntax examples.

Linking to jQuery's source code remotely

This is one technique which developers and php programmers are using today. In this way, programmer don't have to download and save jquery file on their machine. however, you must have really good internet connection for remote method to work. If jquery file from remote url is not downloaded properly, your application wouldn't work. It also means, if remote website is down, then you code will not work as well.



<script type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.0/jquery.min.js?ver=1.4.0"></scri
pt>
view raw gistfile1.txt hosted with ❤ by GitHub

Run Code only when DOM is ready

This first time to do is write jquery ready handler and pretty much everything will go inside this. Again, you can have as many jquery ready handler as you want on single page, but each and every operation required to be done with jquery must be called within jQuery Ready Handler

Here is what it looks like:
$(document).ready(function() {
// all jQuery code goes here
});
view raw gistfile1.txt hosted with ❤ by GitHub

Selecting Elements in Jquery

Selecting an html element is very basic operation performed with jQuery, You can select different HTML element in jQuery by using either it's id, class name or tag name. You can even select tags within a div ( which has some class or id defined already). There are so many things you can do with jquery and you can select any html element and perform different operation with jQuery

$("P"); // selects all HTML P elements
$("#myDiv"); // selects one HTML element with ID "myDiv"
$(".myClass"); // selects HTML elements with class "myClass"
$("p#myDiv"); // selects HTML paragraph element with ID "myDiv"
$("ul li a.headerlinks");
// selects anchors with class "headerlinks" that are nested in list items
view raw gistfile1.txt hosted with ❤ by GitHub

No comments:

Post a Comment