What is Jquery ? How to use Jquery? | Tutorial

What is Jquery ? How to use Jquery? | Tutorial

Jquery means “Write less, do more”. jQuery is javaScript’s library. This is not a programming language. There is an added advantage of having jQuery cross-browser compatible. Jquery makes HTML document easier for web development easier, event handling, animating, and Ajax interaction.

Jquery is lightweight and easy to use in webpages. In Javascript, we have to write more code, but in Jquery, we can do the same thing in the less code. It is very easy and simple to use.

How to JavaScript and jQuery are written. We can also compare using the below example.

document.getElementById('demo').innerHTML = 'Hello, World!'
$('#demo').html('Hello, World!')

Jquery library & Features

The jQuery library contains the following features:

  • HTML/DOM manipulation
  • CSS manipulation
  • HTML event methods
  • Effects and animations
  • AJAX
  • Utilities

How to use jQuery?

There are two simple and easy to use jQuery in HTML/Webpages.

  • Download & Use jQuery − You can download jQuery library and include it in your HTML code.
  • Use jQuery CDN (Content Delivery Network) − You can include jQuery library into your HTML code directly from Content Delivery Network (CDN).

Download & Use jQuery

Go to the jQuerySite to download the latest version of jquery.
After downloading jquery library latest version, place jquery library in your project folder.

Example

Now you can include jquery library in your HTML Or Webpages.

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>jQuery Example</title>
    <script src="/jquery/jquery/3.3.1/jquery.min.js"></script>
  </head>

  <body>

  </body>
   <script>
    alert("window is loaded");
   </script>
</html>

Use jQuery CDN

You can include jQuery library into your HTML code or webpages directly from Content Delivery Network (CDN). There are few providers for content delivery of latest jquery library below.

Example

Now you can include jquery library CDN in your HTML Or Webpages.

<!DOCTYPE html>
<html lang="en">
  <head>
    <title>jQuery Example</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  </head>

  <body>

  </body>
   <script>
   alert("window is loaded");
   </script>
</html>

AuthorAdmin

My name is Devendra Dode. I am a full-stack developer, entrepreneur, and owner of Tutsmake.com. I like writing tutorials and tips that can help other developers. I share tutorials of PHP, Python, Javascript, JQuery, Laravel, Livewire, Codeigniter, Node JS, Express JS, Vue JS, Angular JS, React Js, MySQL, MongoDB, REST APIs, Windows, Xampp, Linux, Ubuntu, Amazon AWS, Composer, SEO, WordPress, SSL and Bootstrap from a starting stage. As well as demo example.

Leave a Reply

Your email address will not be published. Required fields are marked *