Setting Up jQuery

Two Ways to Add jQuery

You can download the file and host it yourself, or load it from a CDN. The CDN is fastest and caches across sites.

Official CDN

<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>

Place the script tag before your own scripts so $ exists when you use it.

Downloading Locally

# Download the minified production build
https://code.jquery.com/jquery-3.7.1.min.js -> js/jquery.min.js

<script src="js/jquery.min.js"></script>

Production vs Development Builds

• jquery.js: readable, unminified - for development.
• jquery.min.js: compressed - for production.
• Add integrity and crossorigin attributes when using a CDN for security (SRI) and integrity checking.

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

Verifying It Loaded

if (window.jQuery) {
  console.log('jQuery ' + jQuery.fn.jquery + ' is ready');
}

Key Points

• Load jQuery before your own code.
• Use the CDN for speed; download for offline work.
• Use the minified build in production.
• SRI attributes harden CDN usage.