📅 最后修改于: 2023-12-03 14:53:02.057000 🧑 作者: Mango
jQuery 是一款广泛使用的 JavaScript 库，它能够简化 HTML 文档遍历、事件处理、动画和 Ajax 操作等常见任务。本文将介绍如何将 jQuery 代码添加到 HTML 文件中，让您的网页拥有更多功能。
首先需要从 jQuery 官网 https://jquery.com/ 下载所需的 jQuery 库文件。选择合适的版本，一般来说推荐选择最新稳定版本。
将下载的 jQuery 库文件（通常是一个 .js 文件）保存到本地，然后在 HTML 文件中使用以下代码来添加 jQuery 到您的网页中：
<script src="jquery.js"></script>
其中，src 属性的值是 jQuery 库文件的路径。
如果您希望使用 jQuery 官方提供的 CDN（Content Delivery Network），请将以下代码添加到您的 HTML 文件中：
<script src="https://cdn.jsdelivr.net/npm/jquery/dist/jquery.min.js"></script>
这将从 jQuery 官方 CDN 上下载最新版本的 jQuery 库文件。当用户访问您的网站时，该文件将自动从最近的 CDN 服务器加载，从而提供快速和可靠的加载速度。
在将 jQuery 添加到您的 HTML 文件后，就可以在您的 JavaScript 代码中使用它了。以下是一个简单的例子，演示如何使用 jQuery 绑定事件：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>jQuery 示例</title>
<script src="https://cdn.jsdelivr.net/npm/jquery/dist/jquery.min.js"></script>
</head>
<body>
<button>点击我</button>
<script>
$(document).ready(function(){
$("button").click(function(){
alert("Hello World!");
});
});
</script>
</body>
</html>
在这个例子中，当用户点击 button 元素时，Hello World!文本将显示在弹出框中。这是通过使用 jQuery $ 函数和 .click() 方法来实现的。在 $(document).ready() 函数内部定义了一个事件处理程序，用于绑定 click 事件和回调函数。
以上就是将 jQuery 代码添加到 HTML 文件的方法。本文介绍了如何下载 jQuery 库文件并将其添加到 HTML，以及如何使用它来实现基本的交互功能。希望本文能帮助您更好地使用 jQuery。