服务时间:8:30-18:00

首页 >web前端网

html怎么连接jquery

发布时间:2023-12-18 15:49 字数:1063字 阅读:109

html怎么连接jquery?要在HTML中连接 jQuery 库,可以通过以下两种方式之一:

html怎么连接jquery

1. 通过 CDN 连接:
   ```html
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
   ```
   这将通过 Google 的 CDN 连接到最新版本的 jQuery 库。你可以将此 `<script>` 标签放置在 HTML 文档的 `<head>` 或 `<body>` 部分中,以便在页面加载时引入 jQuery。

2. 下载并本地连接:
   - 首先,前往 [jQuery 官方网站](https://jquery.com/) 下载所需的 jQuery 库文件(通常是一个 `.js` 文件)。
   - 将下载的 jQuery 文件保存到你的项目文件夹中的合适位置。
   - 在 HTML 文档中使用 `<script>` 标签引入 jQuery 文件:
     ```html
     <script src="path/to/jquery.min.js"></script>
     ```
     将 `path/to/jquery.min.js` 替换为实际的文件路径。

连接完成后,你就可以在 HTML 中使用 jQuery 的功能了。可以在 `<script>` 标签中编写 jQuery 代码,或者将其放在外部的 JavaScript 文件中,并在 HTML 中通过 `<script>` 标签引入该文件。

以下是一个示例,演示了如何连接 jQuery 并在页面加载完成后执行一段 jQuery 代码:
```html
<!DOCTYPE html>
<html>
<head>
  <title>Connect jQuery</title>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
  <script>
    // jQuery 代码
    $(document).ready(function() {
      // 在文档加载完成后执行的代码
      alert("Hello, jQuery!");
    });
  </script>
</head>
<body>
  <!-- 页面内容 -->
</body>
</html>
```

在上述示例中,我们使用了 Google 的 CDN 连接到 jQuery,并在页面加载完成后弹出一个消息框。你可以根据需要自由编写 jQuery 代码,以实现所需的交互和功能。