05 Nov How to run jQuery on local machine
Learn how to run jQuery on the local machine. Running jQuery needs you to run it locally or use the CDN-based environment.
- Downloading the Local Version and adding it to the HTML code, whereas
- CDN (Content Delivery Network) based means adding jQuery library into the HTML code directly from CDN.
Downloading jQuery Local Version
Under local development, two versions are provided,
- Production jQuery– Version for running on a live website. It is a compressed version.
- Development jQuery– Version for testing and development. It is an uncompressed version.
Here, you can see the screenshot, which is displaying both the downloads,
Let’s work around running jquery on the local system:
Step 1- Visit the jQuery Downloads page and download jQuery. The current version is 3.2.1.
Step 2- We downloaded jquery-3.2.1.min.js file and now place it under the same directory files where you have created your website pages. Here, we will see the location,
We create our project folder with the name Studyopedia,
|
1 2 3 |
C:\Studyopedia |
Now add the downloaded file jquery-3.2.1.min.js in the same directory.
Before delving into CDN-based working of jQuery, let’s see how we can work with the jQuery library on our local system. Assuming jquery-3.2.1.mim.js is downloaded and saved on local system:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 |
<html> <head> <script src="jquery-3.2.1.min.js"> </script> <script> // Add script here </script> </head> <body> </body> </html> |
jQuery Content Delivery Network (CDN)
If you don’t want to delve into downloading and adding the jQuery file to your local system, then there’s an additional option available. Go with the CDN-based version and include jQuery in your HTML code directly from the CDN.
Here, we have two options for CDN as well i.e. Google and Microsoft,
Google CDN
Here’s how you can work with Google CDN to include the jQuery library in your HTML code,
|
1 2 3 |
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> |
Here’s how you can include the jQuery library with Google CDN:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 |
<html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"> </script> <script> // Add script here </script> </head> <body> </body> </html> |
Microsoft CDN
Here’s how you can work with Microsoft CDN to include the jQuery library in your HTML code,
|
1 2 3 |
<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.6.4.min.js"></script> |
Here’s how you include the jQuery library with Microsoft CDN,
|
1 2 3 4 5 6 7 8 9 10 11 12 13 |
<html> <head> <script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.6.4.min.js"> </script> <script> // Add script here </script> </head> <body> </body> </html> |
In this lesson, we learned how to run jQuery on the local machine by first downloading it. We also saw how to begin with jQuery without downloading it i.e. using CDN.
No Comments