I looovvveeeee jQuery

I’ve become a fan of jQuery. The day I started working on JQuery, I keep admiring about the architecture of the framework. As the caption rightly says “Write less and do more”, our source code will be reduced considerably, using this framework.

There are plenty of other frameworks available on the web like “Prototype”, “MooTools”, “YUI” by yahoo, “Dojo” etc., But I like jQuery. May be the first one I started using it.
I know this is not anything new. These frameworks exist from years back.

Here I will explain in simple terms about what JQuery is and how it works.

The basis of jQuery is “selectors”. We use regular expression like queries to select the DOM elements in the web page. We were using the below code segment to retrieve the DOM elements.

document.getElementById("tag id");

$ -> is nothing but a function given by jQuery which returns the jQuery DOM object array. jQuery DOM object has more functions, which can do lot of stuff. $ function takes a string parameter, criteria for the objects to select. A simple jQuery statement is given below.

$(“a").text("hi");

The above statement, will select all “anchor” tag in the web page and set the text to “hi”. We have given the simple criteria for selection, ie., “a” tags. The same way the below statement will hide all the “div” tags in the web page.

$("div").hide();

The functions text(), and hide() provided by jQuery are cool stuff. The hide() function takes the parameter like ‘slow’ and ‘fast’. Check the below demo for more clarification. You can also select a particular DOM element by just passing the element id like this

$(“#divid”).show();

I’d like to take this opportunity to announce the brand new jQuery 1.0! A lot of work has gone into this release. A lot of bugs fixed, a ton of new features, and a complete overhaul of how the jQuery development process is run.

By John Resig (from jQuery website, published in Aug 2006)

Thats all for now folks! Check more selectors and tutorials here. Happy jQuerying!!

Note: As jQuery $ is not working in WordPress, I’m using jQuery keyword itself for the above demo. I’m not going to dig more into it.

Leave a Reply

Your email address will not be published. Required fields are marked *