Quick Jquery Tutorial


This is complete jQuery tutorial for beginners and is developed for the absolute beginners trying to learn jQuery in quickest possible time. This tutorial will help you in getting started with jQuery in very short time. Let's get started with the jQuery tutorial for absolute beginners. In this tutorial you will learn how to download jQuery library and then add it to your project and develop simple program that shows alert message on the page load.

  • Downloading jQuery library. The jQuery library can be downloaded from http://code.jquery.com/jquery-1.4.2.min.js. Download the file and save it a directory on your hard disk.
  • Adding jQuery library to web page Following line is required to add the jQuery library in the web page. <script type="text/javascript" src="jquery-1.4.2.min.js"><⁄script>
  • Adding jQuery code to show alert message. Add the following code to display the alert message on page load:

    <Script language="JavaScript">

    $(document).ready(function() {

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

    alert("jQuery tutorial for beginners Example");

    });

    });

    <⁄Script>

    then add a button in the inside the body naming it click me! and has a class name of button name, putting class or id to the button is important because it is where the jquery base it's execution.

    <input type="button" class="buttonname" value="click me!">

    The $(document).ready(function() {} function is called once document dom tree is ready. An in this function we have added the JavaScript alert function to display the alert message. In this have developed very simple example that displays the alert message "jQuery tutorial for beginners Example" on the screen.
  • Demo:

    jQuery Tutorial for beginners Example(Simple Alert)

    What Next?

    Now you can learn jQuery in detail with the help of some jQuery tutorials at: http://www.w3schools.com