HowTo – Introduction To jQuery

Filed under: Web Design — Tags: ,

The jQuery package is a comprehensive library of JavaScript functions that are commonly used by web developers. The library has been tested for cross browser compatibility and it streamlines your ability to access HTML Elements within your documents. In addition to the main library package you can extend jQuery with plugins that you or others write.

In addition to jQuery you are likely to run across other JavaScript Framework Libraries such as MooTools, Smart Client, Dojo, Google Web Toolkit and many others. Their features will vary and some are used only to create specific function.

jQuery can be used used on its own or to build Ajax websites that pull data from your server without the need for a page reload.

You can select and modify with your own functions groups of elements such as a <a>link</a> or individual elements by selecting those elements that have CSS IDs applied to them <a id=”thisone”>link</a>

Including the jQuery library in your documents

To include the jQuery library you do so like any other external JavaScript file.

A line like the following should be placed in your page’s header area.

[php]<script type="text/javascript" src="http://www.yoursite.com/dir/jquery.js"></script>[/php]

Making use of jQuery

The way you make use of jQuery will depend on your project but once you have included the main jquery.js file in the header area of your document you will have access to all of the functions in the library.

Once the library is available you can call it for a HTML Element such as the <a> link tag.

[php]
$(document).ready(function(){
$("a").click(function(event){
alert("Annoying Alert!");
});
});
[/php]

In future HowTos we will look at putting jQuery into action.

To download jQuery and read additional documentation visit:

http://jquery.com/