What is jQuery?

jQuery is a fast and concise JavaScript Library created by John Resig in 2006 with a nice motto − Write less, do more.
jQuery simplifies HTML document traversing, event handling, animating, and Ajax interactions for rapid web development.

jQuery is a JavaScript toolkit designed to simplify various tasks by writing less code. Here is the list of important core features supported by jQuery −

  • DOM manipulation − The jQuery made it easy to select DOM elements, traverse them and modifying their content by using cross-browser open source selector engine called Sizzle.
  • AJAX Support − The jQuery helps you a lot to develop a responsive and feature-rich site using AJAX technology.
  • Event handling − The jQuery offers an elegant way to capture a wide variety of events, such as a user clicking on a link, without the need to clutter the HTML code itself with event handlers.
  • Lightweight − The jQuery is very lightweight library - about 19KB in size ( Minified and gzipped ).
  • Animations − The jQuery comes with plenty of built-in animation effects which you can use in your websites.
  • Latest Technology − The jQuery supports CSS3 selectors and basic XPath syntax.
  • Cross Browser Support − The jQuery has cross-browser support, and works well in IE 6.0+, FF 2.0+, Safari 3.0+, Chrome and Opera 9.0+

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

  • Go to the https://jquery.com/download/ to download the latest version available.
  • 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-1.12.4.min.js"></script>
		
      <script type = "text/javascript">
         $(document).ready(function(){
            document.write("Hello, World!");
         });
      </script>		
   </head>
	
   <body>
      <h1>Hello</h1>
   </body>
	
</html>

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 = "https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
		
      <script type = "text/javascript">
         $(document).ready(function(){
            document.write("Hello, World!");
         });
      </script>
   </head>
	
   <body>
      <h1>Hello</h1>
   </body>
	
</html>

Be the first to comment

Leave a Reply

Your email address will not be published.


*