当前位置:首页 > jquery

如何引入jquery

2026-02-03 17:21:33jquery

引入 jQuery 的方法

通过 CDN 引入
使用公共 CDN(内容分发网络)加载 jQuery,适合快速开发或在线项目。将以下代码放入 HTML 的 <head><body> 部分:

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

推荐使用官方 CDN(如 code.jquery.com)或可信赖的第三方 CDN(如 Google、Microsoft 提供的版本)。

本地文件引入
下载 jQuery 文件并保存到项目目录中,通过相对路径引入。

  1. jQuery 官网 下载最新版本。
  2. 将文件(如 jquery-3.6.0.min.js)放入项目文件夹(例如 js/)。
  3. 在 HTML 中添加:
    <script src="js/jquery-3.6.0.min.js"></script>

模块化项目中使用 npm/yarn
适用于现代前端框架(如 React、Vue)或 Node.js 环境。
通过 npm 安装:

npm install jquery

通过 yarn 安装:

yarn add jquery

在代码中引入:

import $ from 'jquery';

验证引入是否成功
在引入后,可通过以下代码测试:

<script>
  $(document).ready(function() {
    console.log("jQuery 已加载");
  });
</script>

如果控制台输出日志,则说明引入成功。

注意事项

  • 优先使用压缩版本(如 jquery-x.x.x.min.js)以减少加载时间。
  • 确保 jQuery 在依赖它的其他脚本之前引入。
  • 如需兼容旧版浏览器,可考虑引入 jQuery 1.x 或 2.x 版本(注意官方已停止维护旧版)。

如何引入jquery

标签: jquery
分享给朋友:

相关文章

jquery版本

jquery版本

jQuery 的版本历史及当前状态如下: 当前稳定版本 jQuery 的最新稳定版本是 3.6.4(发布于 2023 年 3 月),支持现代浏览器并修复了部分安全问题。 主要版本分支 j…

jquery api

jquery api

以下是关于 jQuery API 的详细介绍和使用方法: jQuery API 概述 jQuery 是一个快速、简洁的 JavaScript 库,简化了 HTML 文档遍历、事件处理、动画和 Aj…

jquery选择器

jquery选择器

jQuery 选择器基础 jQuery 选择器用于选取 DOM 元素,基于 CSS 选择器语法扩展。通过 $() 或 jQuery() 函数调用,返回匹配元素的集合。 常见选择器类型…

jquery 获取

jquery 获取

jQuery 获取元素的方法 jQuery 提供了多种方法来获取 DOM 元素,以下是常用的几种方式: 通过 ID 获取元素 使用 $("#id") 可以获取指定 ID 的元素。例如: $("#m…

jquery 元素

jquery 元素

jQuery 元素选择与操作 jQuery 是一个快速、简洁的 JavaScript 库,简化了 HTML 文档遍历、事件处理、动画和 Ajax 交互。以下是 jQuery 中常用的元素选择与操作方法…

jquery对象

jquery对象

jQuery 对象简介 jQuery 对象是通过 jQuery 选择器或方法创建的封装了 DOM 元素集合的对象。它提供了一系列便捷的方法来操作 DOM、处理事件、实现动画等。与原生 DOM 对象不同…