jQuery

jQuery is a JavaScript Library.

jQuery greatly simplifies JavaScript programming.

jQuery is easy to learn.

"Try it yourself" Examples in Each Chapter

With our online editor, you can edit the code, and click on a button to view the result.

Example

<html>
<head>

<script type="text/javascript" src="jquery.js"></script>

<script type="text/javascript">

$(document).ready(function(){

  $("p").click(function(){

  $(this).hide();

  });

});

</script>

</head>
<body>

<p>If you click on me, I will disappear.</p>

</body>
</html>

The jQuery library can be added to a web page with a single line of markup.

What You Should Already Know

Before you start studying jQuery, you should have a basic knowledge of:

HTML
CSS
JavaScript

What is jQuery?

jQuery is a library of JavaScript Functions.

jQuery is a lightweight "write less, do more" JavaScript library.

The jQuery library contains the following features:

HTML element selections
HTML element manipulation
CSS manipulation
HTML event functions
JavaScript Effects and animations
HTML DOM traversal and modification
AJAX
Utilities

Adding the jQuery Library to Your Pages

The jQuery library is stored as a single JavaScript file, containing all the jQuery methods.

It can be added to a web page with the following mark-up:

<head>

<script type="text/javascript" src="jquery.js"></script>

</head>

Please note that the <script> tag should be inside the page's <head> section.

Basic jQuery Example

The following example demonstrates the jQuery hide() method, hiding all <p> elements in an HTML document.

Example

<html>

<head>

<script type="text/javascript" src="jquery.js"></script>

<script type="text/javascript">

$(document).ready(function(){

  $("button").click(function(){

    $("p").hide();

  });

});

</script>

</head>

<body>

<h2>This is a heading</h2>

<p>This is a paragraph.</p>

<p>This is another paragraph.</p>

<button>Click me</button>

</body>

</html>

Downloading jQuery

Two versions of jQuery are available for downloading: one minified and one uncompressed (for debugging or reading).

Both versions can be downloaded from jQuery.com.

Alternatives to Downloading

If you don't want to store the jQuery library on your own computer, you can use the hosted jQuery library from Google or Microsoft.

Google

<head>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

</head>

Microsoft

<head>

<script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery/jquery-1.4.2.min.js"></script>

</head>

Java 'The Next Generation'

Thursday 28 April 2011

jQuery Introduction

jQuery

"Try it yourself" Examples in Each Chapter

Example

What You Should Already Know

What is jQuery?

Adding the jQuery Library to Your Pages

Basic jQuery Example

Example

Downloading jQuery

Alternatives to Downloading

Google

Microsoft

No comments:

Post a Comment