Pages

27 January 2016

How to use jQuery?

How to use jQuery?

There are two ways to use jQuery.


  • Local Installation − You can download jQuery library on your local machine and include it in your HTML code.



  • CDN Based Version − You can include jQuery library into your HTML code directly from Content Delivery Network (CDN).


Local Installation





  • Now put downloaded jquery-2.1.3.min.js file in a directory of your website, e.g. /jquery.



Example

Now you can include jquery library in your HTML file as follows −


<html>

   <head>
      <title>The jQuery Example</title>
      <script type = "text/javascript"  src = "/jquery/jquery-2.1.3.min.js"></script>
  
      <script type = "text/javascript">
         $(document).ready(function(){
            document.write("Hello, World!");
         });
      </script>  
   </head>
 
   <body>
      <h1>Hello</h1>
   </body>
 
</html>

Output

Hello, World!



CDN Based Version


You can include jQuery library into your HTML code directly from Content Delivery Network (CDN). Google and Microsoft provides content deliver for the latest version.

We are using Google CDN version of the library throughout this tutorial.


Example

Now let us rewrite above example using jQuery library from Google CDN.
<html>

   <head>
      <title>The jQuery Example</title>
      <script type = "text/javascript" 
         src = "http://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
  
      <script type = "text/javascript">
         $(document).ready(function(){
            document.write("Hello, World!");
         });
      </script>
   </head>
 
   <body>
      <h1>Hello</h1>
   </body>
 
</html>
This will produce following result −

Output

Hello, World!

No comments:

Post a Comment