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>