phpicoder Dec 14, 2021 Jquery

Hi guys, In this tutorial we will learn jquery introduction, jQuery is a fast and lightweight JavaScript Library created by John Resig in 2006 with a nice motto: Write less, do more.

What is jQuery?

jQuery is a JavaScript lightweight library, and also simplifies a lot of the complicated things from JavaScript, like AJAX calls and DOM manipulation.

jQuery is a easy to use and single line code for web applications and all most applications use jQuery becose jQuery is a most popular JavaScript library.

jQuery Features

  • Latest Technology 
  • HTML/DOM manipulation
  • Effects and animations
  • Event handling
  • AJAX Support
  • Lightweight
  • Cross Browser Support
  • CSS3 Compliant

How to use jQuery? 

There are two ways to use jQuery.

  1. Download jQuery library 
  2. Include CDN File
Download jQuery 

There are many versions of jQuery available, so if you need Download jQuery then go to from  https://jquery.com/download/ and this is a offical web site. 

After downloading jQuery, include this file under the <head> section, which is the following code.

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

You can embed the jQuery library in your HTML code directly from the Content Distribution Network (CDN). which is the following code. 

<html>
  <head>
  	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
  </head>
</html>
syntax
$(selector).action()
  • $ : sign to define/access jQuery
  • (selector) : HTML elements class or id
  • action() : A jQuery action() like  
Example 
<html>
 <head>
  <title>jQuery Example</title>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
  <script>
    $(document).ready(function() {
      $("#btn" ).click(function() {
       	$(this).hide();
      });
    });
  </script>
 </head>
 <body>
    <button id="btn">Click Me!!</button>
 </body>
</html>

I hope this tutorial help for you...