当前位置:首页 > 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

注意事项

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

标签: jquery
分享给朋友:

相关文章

jquery加载

jquery加载

jQuery 加载方法 使用 CDN 加载 jQuery 推荐通过公共 CDN(如 Google、Microsoft 或 jQuery 官方)加载,速度快且可能已被浏览器缓存。 <…

jquery删除

jquery删除

jQuery 删除元素的方法 使用 jQuery 删除 DOM 元素有多种方式,可以根据需求选择合适的方法。 remove() 方法remove() 方法会删除选中的元素及其子元素,同时移除元素上的…

jquery字符串

jquery字符串

jQuery 字符串操作 jQuery 提供了多种方法来处理字符串,尽管它主要是一个 DOM 操作库,但字符串处理在动态内容生成和数据交互中非常常见。 字符串拼接与连接 使用 JavaScript…

jquery 版本

jquery 版本

以下是关于 jQuery 版本的详细信息: jQuery 主要版本概览 jQuery 目前有三个主要版本分支:1.x、2.x 和 3.x。每个分支针对不同的浏览器兼容性和功能需求设计。 jQuer…

jquery 视频

jquery 视频

使用 jQuery 播放视频 jQuery 可以简化 HTML5 视频的控制。通过 video 元素的 DOM 操作,可以实现播放、暂停等功能。 // 播放视频 $("#myVideo").trig…

jquery 源码

jquery 源码

jQuery 源码解析 jQuery 是一个快速、小巧且功能丰富的 JavaScript 库。以下是其核心源码结构的解析: 核心架构 jQuery 源码采用模块化设计,核心功能包括选择器引擎、DOM…