【JavaScript】jquery的导入方式有两种:本地导入和线上导入

前言

jQuery是一个用来代替JavaScript来快捷书写前端脚本语言的库,jQuery可以大大的简化复杂的js代码,使开发人员专注于实现页面的效果。

导入方式有两种

jQuery的导入方式有两种,一种是本地导入,一种是利用超链接导入。

方法一:本地导入

  • 进入 jQuery 的官方网站:https://jquery.com
  • 点击 Download jQuery

在这里插入图片描述

  • 点下图链接,可以看到jquery的源码,如下:

在这里插入图片描述

  • 直接ctrl+A,选中所有的 jQuery 的源码,在VScode新建一个txt文件,将源码拷贝到其中,然后修改后缀名为.js即可。
    在这里插入图片描述

  • 然后,在要使用jquery的页面引入这个.js文件,代码如下:

<script src="你的.js文件路径"></script>

在这里写 jquery 代码

<script>//在此书写你的jQuery代码
</script>
  • 注意,一定要先引入 jQuery 源码,再引入自己写的 jQuery 代码,因为页面的加载顺序是从上到下加载,如果浏览器会先加载你的 jQuery 代码再加载 jQuery 库,造成你的 jQuery 代码会被认为是错误书写格式,无法实现效果。

方法二:在线上导入有两种方法

  • 在使用jQuery库之前,需要先引入它。有两种方法可以在线引入 jQuery 库:从官方网站直接下载或从CDN下载。

1. 从官方网站下载:

  • 在下载jQuery库之前,需要访问官方网站,并选择要下载的版本。然后在HTML代码中添加以下内容:
<script src="jquery-3.6.0.min.js"></script>
  • 这将从文件系统中加载 jQuery 库,并将其添加到HTML页面中。

2. 从CDN下载:

  • 许多大型互联网公司提供了CDN服务,其中包括谷歌,微软,jQuery和CDNJS等。
  • 这里我们以谷歌CDN为例,在HTML代码中添加以下内容:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
  • 这将从谷歌CDN服务器上下载jQuery库,并将其添加到HTML页面中。

补充

  • 通过在 script 的 src 属性中写一个网址来导入在线的 jQuery 代码。
  • 现在应用 jQuery 的网站非常非常多,可以在其他网站上扒一个 jQuery 代码链接
  • 浏览器会在加载之前使用jQuery的网站时就预先下载过jquery,因此到了我们这里就不用再次下载了,就算我们的jQuery版本是一个新的没被浏览器加载过的版本,jQuery的代码下载也会进行的很快
  • 但是,如果你还是担心影响加载速度,本地导入jQuery文件确实是最好的办法。
  • 导入在线 jQuery:
<script src=""></script>
<script>//在此书写你的jQuery代码
</script>

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/84317.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

SpringBoot 整合MyBatis

整合MyBatis 官方文档&#xff1a;http://mybatis.org/spring-boot-starter/mybatis-spring-boot-autoconfigure/ Maven仓库地址&#xff1a;https://mvnrepository.com/artifact/org.mybatis.spring.boot/mybatis-spring-boot-starter/2.1.3 整合测试 导入 MyBatis 所需要的…

Python数据分析案例03——天气K均值聚类分析

聚类常用的算法肯定是K均值聚类了&#xff0c;本次案例采用陕西的十个地区的天气数据&#xff0c;构建特征&#xff0c;进行聚类分析。 首先数据都装在‘天气数据’这个文件夹里面&#xff0c;如图&#xff1a; 打开其中一个excel&#xff0c;长这个样子 下面开始数据处理 数据…

Django实现音乐网站 ⑼

使用Python Django框架制作一个音乐网站&#xff0c; 本篇主要是后台对专辑、首页轮播图原有功能的基础上进行部分功能实现和显示优化。 目录 专辑功能优化 新增编辑 专辑语种改为下拉选项 添加单曲优化显示 新增单曲多选 更新歌手专辑数、专辑单曲数 获取歌手专辑数 保…

07-2_Qt 5.9 C++开发指南_二进制文件读写(stm和dat格式)

文章目录 1. 实例功能概述2. Qt预定义编码文件的读写2.1 保存为stm文件2.2 stm文件格式2.3 读取stm文件 3. 标准编码文件的读写3.1 保存为dat文件3.2 dat文件格式3.3 读取dat文件 4. 框架及源码4.1 可视化UI设计4.2 mainwindow.cpp 1. 实例功能概述 除了文本文件之外&#xff…

MGRE综合

实验 一、实验思路 1.先按照上图配置IP地址及环回 2.写缺省使公网可通 3.让R1、R4、R5每台路由器均成为中心站点形成全连网状结构拓扑 4.让R1成为中心站点R2R3为分支站点 5.分区域宣告ospf之后更改ospf在虚拟接口Tunnel工作方式为broadcast及让R1 当选DR 二、上虚拟机操作…

数字万用表测量基础知识--DMM的显示位数

概览 DMM&#xff08;即数字万用表&#xff09;是一种电气测试和测量仪器&#xff0c;可测量直流和交流信号的电压、电流和电阻。本文介绍如何正确使用和理解数字万用表(DMM)。 DMM的显示位数 数字万用表(DMM)可用于进行各种测量。在选择DMM或理解所使用的DMM时&#xff0c;首…

改进的麻雀算法优化最大相关峭度解卷积(SCSSA-MCKD),实现早期微弱故障诊断,MATLAB代码实现

01 引言 由于一些设备的早期故障产生的冲击十分微弱&#xff0c;易被系统噪声干扰&#xff0c;如何有效地对设备的原始故障信号进行降噪并增强信号中微弱冲击成分&#xff0c;是进行该类部件早期故障诊断的关键。 最大相关峭度解卷积&#xff08;MCKD&#xff09;通过解卷积运算…

Kotlin读写分离CopyOnWriteArrayList

Kotlin读写分离CopyOnWriteArrayList 基于读写分离思想Copy-On-Write(COW)设计的线程安全ArrayList变体&#xff0c;读读共享、写写互斥、读写互斥、写读互斥。读时直接读&#xff0c;不用加锁同步&#xff0c;线程安全。写/删/修改数据时复制一个副本&#xff0c;在新的List副…

【AI理论学习】手把手推导扩散模型:Diffusion Models(DDPM)

手把手推导扩散模型&#xff1a;Diffusion Models&#xff08;DDPM&#xff09; DDPM理论回顾前置知识过程详解Forward ProcessReverse Process DDPM算法伪代码训练部分采样部分 总结一下 参考链接 在这篇博客文章中&#xff0c;我们将深入研究 去噪扩散概率模型(也称为 DDPM&…

Linux Linux系统文件类型与文件权限

一、文件类型 &#xff08;1&#xff09;在windows系统中文件类型以文件的后缀名来区分&#xff0c;在Linux系统中文件类型不以后缀名来区分。注意编写c代码时必须写后缀名.c&#xff0c;不然C编译器不会编译该文件。 &#xff08;2&#xff09;在Linux系统中以文件的标志来区…

如何用SOLIDWORKS Simulation 避免共振现象

零件都有它的固有振动频率&#xff0c;称之为共振频率。当零部件的固有频率和激励频率相近时&#xff0c;对零部件的破坏是非常严重的&#xff0c;这就是我们说的共振。频率分析是设计师日常工作常见的设计验证。 今天给大家分享的是Simulation的频率分析操作方法&#xff1a; …

Linux配置QT Creator环境:ubuntu中安装QT Creator环境

一、前景 目前市面上很多公司使用QT Creator进行界面开发&#xff0c;基本都会选择在Linux环境进行&#xff0c;优点不仅是市场所需&#xff0c;更是方便后期代码的移植&#xff0c;相较于Windows系统&#xff0c;Linux系统移植性非常好。故此篇文章&#xff0c;介绍如何在Linu…

【深度学习注意力机制系列】—— CBAM注意力机制(附pytorch实现)

CBAM&#xff08;Convolutional Block Attention Module&#xff09;是一种用于增强卷积神经网络&#xff08;CNN&#xff09;性能的注意力机制模块。它由Sanghyun Woo等人在2018年的论文[1807.06521] CBAM: Convolutional Block Attention Module (arxiv.org)中提出。CBAM的主…

在工作中使用ChatGPT需要担心泄密问题吗?

​OpenAI的ChatGPT可以通过自动简化繁琐的任务&#xff0c;针对挑战性问题的提供创造性的解决方案来提高员工的生产力。但随着这项技术被整合到人力资源平台和其他工作场所中&#xff0c;它给各个企业带来了巨大的挑战。苹果、Spotify、Verizon和三星等大公司已禁止或限制员工在…

CC++内存管理

欢迎来到Cefler的博客&#x1f601; &#x1f54c;博客主页&#xff1a;那个传说中的man的主页 &#x1f3e0;个人专栏&#xff1a;题目解析 &#x1f30e;推荐文章&#xff1a;题目大解析2 目录 &#x1f449;&#x1f3fb;c内存管理方式new/delete 操作内置类型new和delete操…

Java开发要学哪些知识点?建议收藏

随着信息技术的快速发展&#xff0c;Java语言技能成为了企业招聘市场上最受欢迎的技能之一。在这样的市场需求下&#xff0c;Java开发也成为了很多人想要掌握的基本技能之一。那么&#xff0c;我们在学习Java开发时&#xff0c;应当掌握哪些知识点呢?下面&#xff0c;小编将为…

htmlCSS-----案例展示

目录 前言 作品效果 html代码 CSS代码 图片资源 前言 在学习html过程中我们要试着去写写一些案例&#xff0c;通过这些案例让我们更加熟悉代码以及丰富我们的经验&#xff0c;下面是我个人写的一个案例&#xff0c;代码和图片也给出了大家&#xff0c;你们可以参考参考。…

(贪心) 剑指 Offer 14- I. 剪绳子 ——【Leetcode每日一题】

❓剑指 Offer 14- I. 剪绳子 难度&#xff1a;中等 给你一根长度为 n 的绳子&#xff0c;请把绳子剪成整数长度的 m 段&#xff08;m、n都是整数&#xff0c;n > 1 并且 m > 1&#xff09;&#xff0c;每段绳子的长度记为 k[0],k[1]...k[m-1] 。请问 k[0]*k[1]*...*k[m…

IDEA的实用快捷键大全

目录 1.常规快捷键 1.1通用类 1.2注释类 1.3操作类 1.4展开与关闭 2.智能补全类快捷键 3.程序结构类快捷键 4.统一操作快捷键 1.常规快捷键 1.1通用类 像 Ctrl C 复制&#xff0c; Ctrl V 粘贴&#xff0c; Ctrl S保存文件&#xff0c; Ctrl X剪切&#xff0c;这种…

使用XMLHttpRequest实现文件异步下载

1、问题描述 我想通过异步的方式实现下载文化&#xff0c;请求为post请求。一开始我打算用ajax。 $.ajax({type:post,contentType:application/json,url:http://xxx/downloadExcel,data:{data:JSON.stringify(<%oJsonResponse.JSONoutput()%>)},}).success(function(dat…