What is JQuery?

jQuery is fast, lightweight and feature-rich JavaScript library. The purpose of jQuery is to “write less, do more” which make it easy to use JavaScript on our website.

It takes a lot of common tasks that require many lines of JavaScript code to do. The lines are wrap into methods that we can call with a single line of code. It simplifies a lot of thinks from JavaScript, like AJAX calls and DOM manipulation, animation, even handing.

The JQuery library contains the features are:

  • HTML/DOM manipulation
  • Event handing
  • AJAX
  • CSS manipulation
  • Effects and animation
  • Lightweight

Why jQuery is required

We understand what is jQuery is and know the features of it. Now the question is why we use it or What are the needs of it. Here is a answer for your question.

  • It is very fast and extensible.
  • The facilitates of jQuery, the users to write UI related function codes in minimum possible lines.
  • It improves the performance of an application.
  • Browser’s compatible web applications can be developed.
  • It uses mostly new features of new browsers.

So, you can say that out of the lot of JavaScript frameworks, It is the most popular and the most extendable. Many of the biggest companies on the web use jQuery.

Some of these companies are:

  • Microsoft
  • Google
  • IBM
  • Netflix

How to use jQuery

There are two ways to use jQuery:

  • Local installation
  • CDN Based version

Both ways be downloaded from jQuery.com.

Local installation:

The jQuery library is a single JavaScript file, and we reference it with the HTML <Script> tag.

<head>
 <script src="jquery-3.5.1.min.js"></script>
</head>

Example

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

Output


jQuery, first program

CDN Based Version:

We can include jQuery library into our HTML code directly from Content Delivery Network. Google is an example of someone who host jQuery.

<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js">
</script>
</head>

Example

<html>
  <head>
    <title>jQuery example</title> 
    <script src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js">
    </script>
     <script>
       $(document).ready(function(){
        document.write("jQuery, first program");
       })
     </script>
  </head>
  <body>
  <h1>jQuery</h1>
  </body>
</html>

OutPut:



jQuery, first program

jQuery Syntax

Basic syntax is : $(selector).action()

  • A $ sign use to define/access jQuery.
  • A (selector) used to ” query(or find)” HTML elements.
  • A jQuery action() to be performed on the elements(s).

Examples:

$(this).hide() — Hides the current element.

$(“p”).hide() — Hides all <p> elements.

Recommended Posts:

How are java objects stored in memory?

Reference:

w3school.com

tutorialspoint

javapoint.com

Leave a Comment