当前位置:首页 > jquery

js引入jquery

2026-04-08 07:19:06jquery

引入jQuery的方法

通过CDN引入

使用公共CDN(如Google或jQuery官方)直接引入jQuery库,将以下代码放入HTML文件的<head><body>标签内:

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

如需指定版本(例如1.x兼容旧项目):

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

本地文件引入

  1. jQuery官网下载.min.js压缩版文件
  2. 将文件放入项目目录(如js/jquery.min.js
  3. 在HTML中添加引用:
<script src="js/jquery.min.js"></script>

npm/yarn安装(适用于现代前端项目)

在Node.js环境下通过包管理器安装:

npm install jquery
# 或
yarn add jquery

然后在模块化文件中引入:

import $ from 'jquery';

验证引入成功

在引入后添加测试代码:

js引入jquery

<script>
  $(document).ready(function(){
    console.log("jQuery版本:" + $.fn.jquery);
  });
</script>

注意事项

  • 生产环境建议使用min.js压缩版本
  • CDN引入需确保网络连接正常
  • 多个jQuery版本共存时需使用jQuery.noConflict()
  • 现代浏览器项目可考虑使用原生JavaScript替代部分jQuery功能

标签: jsjquery
分享给朋友:

相关文章

vue.js实现轮播

vue.js实现轮播

Vue.js 实现轮播功能 使用第三方库(推荐) Vue.js 生态中有许多成熟的轮播组件库,例如 vue-awesome-swiper 或 swiper,它们功能丰富且易于集成。 安装 swipe…

jquery官网

jquery官网

jQuery 官网地址 jQuery 的官方网站是 https://jquery.com/。该网站提供以下核心内容: 下载 jQuery:提供最新版本的 jQuery 库(压缩版和未压缩版),支…

jquery库

jquery库

jQuery 简介 jQuery 是一个快速、简洁的 JavaScript 库,简化了 HTML 文档遍历、事件处理、动画设计和 Ajax 交互。它兼容多种浏览器,提供易于使用的 API,使开发者能够…

js防抖和节流实现

js防抖和节流实现

防抖(Debounce)的实现 防抖的核心思想是在事件被触发后,延迟执行回调函数。如果在延迟时间内再次触发事件,则重新计时。适用于输入框搜索、窗口大小调整等场景。 function debounce…

js实现抽奖

js实现抽奖

实现抽奖功能的基本思路 抽奖功能的核心是随机选择奖项并展示结果。可以通过数组存储奖项,利用随机数生成索引,最后通过动画增强用户体验。 准备奖项数据 定义一个数组存储奖项信息,每个奖项可以包含名称、图…

jquery获取radio选中的值

jquery获取radio选中的值

获取radio选中的值 使用jQuery获取被选中的radio按钮的值可以通过以下几种方法实现: 方法1:使用:checked选择器 var selectedValue = $('input[na…