Introduction to jQuery

jQuery is a lightweight, "write less, do more", JavaScript library.
The purpose of jQuery is to make it much easier to use JavaScript on your website.
jQuery takes a lot of common tasks that require many lines of JavaScript code to accomplish, and wraps them into methods that you can call with a single line of code.
jQuery also simplifies a lot of the complicated things from JavaScript, like AJAX calls and DOM manipulation.
The jQuery library contains the following features:
  • HTML/DOM manipulation
  • CSS manipulation
  • HTML event methods
  • Effects and animations
  • AJAX
  • Utilities

Please note that jQuery is a simplified JavaScript library. So that plain JavaScript and jQuery can be used to gather or inter mixed code can be used in a Web page.

Getting Started With jQuery

We can start using jQuery in our Web pages by following two ways.

1. By downloading jQuery manifest file from the jQuery.com who the maintaining it
and then adding reference to this file in our website. jQuery can be used in an HTML web page quite easily in following ways.

For this purpose we use <script> tags with in the <head> tags. For example.
<head>
<script src="jquery-3.4.1.min.js"></script>
</head>

jQuery can also be added to Web page near to the end of before the closing </body> tag with the <scripts> Tags. This is recommended method for adding jQuery reference as it decrease the page loading time.

like this 

..........
..........
..........
<script src="jquery-3.4.1.min.js"></script>
</body>
</html>


But it is better to add these file at bottom of the page in order to reduce the page loading time.

2. Second method is using Content Delivery Network (CDN).

We can also add jQuery in our Website using the CDN through jQuery Website which are powered the Stack Path.

For example 

<script   src="https://code.jquery.com/jquery-3.4.1.slim.min.js"   integrity="sha256-pasqAKBDmFT4eHoN2ndd6lN370kFiGUFyTiUHWhU7k8="   crossorigin="anonymous">
</script>


Or using the Google CDN like below.

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

or using the Microsoft CDN like below

<head>
<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.4.1.min.js"></script>
</head>