Wednesday 22 February 2012

How to include JQuery in to a Web Page?

This will guide you to include JQuery into your webpage.
 There are Mainly 2 steps to include JQuery into your webpage.
  1. Including JQuery Library file.
  2. Appending our code to the page.
1. Including Jquery Library File:

There are two ways to include Jquery library files into our webpage.
One is to import Jquery library into your location from here and include JQuery library file  to your webpage as followes

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

Another way is to directly host the  library file location into your web page. Google is providing this facility to include the link directly without downloading Jquery Library file. This we call as Content Delivery Networks(CDN).  Which shown as followes,

2. Appending our code to the page:

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

Simply it is not enough to say JQuery is appended to our webpage it is done. It is wrong. We need to write our own stuff for appropriate events in our webpage.
To include our stuff either we can go for Embedded script style or External Script style

Embedded Script

In Embedded Script style we write all our stuff in the same web page as followes

$(document).ready(function(){
            //your stuff goes here........
});

External Script

In External Script style we write all our stuff in separe JavaScript file and we include that file into our web page as followes

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

Here "custom.js" is our own created file which contains all JQuery stuff that we want to apply for our webpages. 

No comments:

Post a Comment