jQuery 在HTML中链接jQuery

在本文中，我们将介绍如何在HTML中链接和使用jQuery。

阅读更多：jQuery 教程

什么是jQuery？

jQuery是一个快速、精简以及功能强大的JavaScript库。它简化了JavaScript的编写，并且提供了用户界面操作、处理事件、创建动画以及与服务器交互等丰富的功能。通过使用jQuery，我们可以更加高效地开发和管理网页。

在HTML中链接jQuery

要使用jQuery，首先需要在HTML文件中链接到jQuery库。有两种方法可以实现这一点。

方法一：本地下载jQuery库

首先，我们需要从官方jQuery网站(https://jquery.com/)下载jQuery库文件。通常我们会下载最新版本的jQuery库文件，然后将其保存在项目的文件夹中。

在HTML文件中，我们可以通过使用以下代码来链接jQuery库文件：

<script src="路径/到/jquery.min.js"></script>

请确保 "路径/到/jquery.min.js" 是指向你保存的jQuery文件的正确路径。通过这种方式，我们可以将jQuery库文件直接链接到我们的HTML文件中。

方法二：使用CDN链接jQuery库

除了从本地下载jQuery库文件，我们还可以使用CDN（内容分发网络）来链接jQuery库。CDN提供了一个全球分布的网络，它可以帮助我们更快地加载jQuery库文件。

在HTML文件中，我们可以通过使用以下代码链接到CDN版本的jQuery库：

<script src="https://cdn.jsdelivr.net/npm/jquery"></script>

通过这种方式，我们可以从CDN链接到最新版本的jQuery库文件。

例子：使用jQuery改变网页元素

一旦我们成功地链接了jQuery库，我们就可以开始使用它来改变网页的元素了。以下是一个使用jQuery改变网页元素的例子：

<!DOCTYPE html>
<html>
<head>
    <title>使用jQuery改变元素</title>
    <script src="https://cdn.jsdelivr.net/npm/jquery"></script>
</head>
<body>
    <h1 id="title">欢迎使用jQuery</h1>
    <p id="text">这是一个示例文本。</p>

    <script>
        // 使用jQuery改变元素
        (document).ready(function() {("#title").text("Hello, jQuery!");
            $("#text").css("color", "red");
        });
    </script>
</body>
</html>