jQuery Tutorials

Overview

To use jQuery on your site, it must be either downloaded and linked to in the document <head> or included by linking to a CDN in the document <head>.

Downloading the Library

The latest jQuery library can be downloaded from the official jQuery site. Once downloaded, place it in directory of your choice, usually just off the root, and then link to it in your site documents as done in the following.

<head>
    <script src="/js/jquery-3.6.1.min.js"></script>
</head>

Linking to a CDN

Instead of downloading the jQuery library and placing it directly on your site, you can link to a third-party CDN (Content Delivery Network).

The advantage of using a CDN is that users may have already downloaded the jQuery library when visiting another site, and thus, it will be loaded from their browser cache when they visit your site, which leads to a faster loading time.

The latest version can be linked to from the official jQuery site. The link is placed in the head of your site documents.

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

Either way, once the library is available to your site, you can utilize the jQuery library site wide.


jQuery Notes:

  • To use jQuery on your site, it must first be downloaded from the official jQuery site and linked to in your document <head>, or linked to via a CDN in your document <head>
  • It is generally good practice to place your jQuery code/function inside the document load function so that the action takes place ONLY after the document has finished loading
  • When using jQuery, single or double quotation marks are acceptable and work identically to one another; choose whichever you prefer, and stay consistent

We’d like to acknowledge that we learned a great deal of our coding from W3Schools and TutorialsPoint, borrowing heavily from their teaching process and excellent code examples. We highly recommend both sites to deepen your experience, and further your coding journey. We’re just hitting the basics here at 1SMARTchicken.