本章将介绍如何快速安装 jQuery，下面将分别介绍三种安装方式。
这是最简单、最常用的方式，直接通过网络地址引入 jQuery，无需在本地存放文件。
在你的 HTML 文件的 <head> 标签内或 <body> 标签结束前，添加以下代码即可：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>引入 jQuery</title>
<!-- 引入 jQuery 最新稳定版（CDN 方式） -->
<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
</head>
<body>
<script>
// 测试是否引入成功
$(document).ready(function() {
alert("jQuery 安装成功！");
});
</script>
</body>
</html>但是，本教程将使用自己的 CDN，地址如下：
https://www.hxstrive.com/cdn/libs/jquery/3.7.1/jquery.min.js
当然，也可以使用其他 CDN 引入，例如：
注意，我们还可以在浏览器的 Console 窗口中使用 $.fn.jquery 命令查看当前 jQuery 使用的版本：
如果你需要离线使用，或者项目要求本地存放依赖文件，可以按以下步骤操作：
（1）下载 jQuery 文件
访问 jQuery 官方下载地址：https://jquery.com/download/，如下图：
直接保存即可，地址为 https://code.jquery.com/jquery-4.0.0.min.js
（2）引入本地文件
将下载的 jquery-x.x.x.min.js 文件放到项目的 js 文件夹中，然后在 HTML 中引入：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>本地引入 jQuery</title>
<!-- 引入本地 jQuery 文件（路径根据实际文件位置调整） -->
<script src="js/jquery-3.7.1.min.js"></script>
</head>
<body>
<script>
// 测试是否引入成功
if (typeof $ !== 'undefined') {
console.log("jQuery 本地引入成功！");
} else {
console.log("jQuery 引入失败，请检查文件路径！");
}
</script>
</body>
</html>如果你的项目使用 Node.js + npm 管理依赖（如 Vue/React 项目），可以通过命令安装：
（1）执行安装命令
# 安装最新版
npm install jquery --save
# 安装指定版本（如 3.7.1）
npm install jquery@3.7.1 --save（2）在项目中引入使用
// ES6 模块化引入
import $ from 'jquery';
// CommonJS 引入
const $ = require('jquery');
// 测试使用
$(function() {
console.log("npm 安装的 jQuery 可用！");
});（3）验证 jQuery 是否安装成功
无论使用哪种方式，都可以通过以下代码验证：
<script>
// 方式1：检测 $ 或 jQuery 是否存在
if (window.jQuery) {
alert("jQuery 安装成功！版本：" + $.fn.jquery);
} else {
alert("jQuery 安装失败！");
}
// 方式2：简单操作 DOM 测试
$(document).ready(function() {
$("body").css("background-color", "#f5f5f5");
});
</script>更多关于 jQuery 的知识请阅读后续教程。
川公网安备51010802032098