jQuery下载与配置

╰+哭是因爲堅強的太久メ 2022-05-12 00:30 203阅读 0赞

要在自己的网站中应用jQuery库，需要下载并配置它，下面将介绍如何下载与配置jQuery。

**一 下载jQuery**

jQuery是一个开源的脚本库，我们可以从它的官方网站（http://jquery.com）中下载到。

下面介绍具体的下载步骤。

1、在浏览器的地址栏中输入http://jquery.com，并按下〈Enter〉键，将进入到jQuery官方网站的首页。

2、在jQuery官方网站的首页中，进入下载页面：http://jquery.com/download/。

可以下载最新版本的jQuery库，下载截图如下：

![0a272df4-64a7-3691-a278-1478e8398a15.png][]

**二 配置jQuery**

将jQuery库下载到本地计算机后，还需要在项目中配置jQuery库。

即将下载后的jquery-3.1.1.min.js文件放置到项目的指定文件夹中，通常放置在JS文件夹中，然后在需要应用jQuery的页面中使用下面的语句，将其引用到文件中。

<script language="javascript" src="JS/jquery-3.1.1.min.js"></script>

或者

<script src="JS/jquery-3.1.1.min.js" type="text/javascript"></script>

引用jQuery的<script>标签，必须放在所有的自定义脚本文件的<script>之前，否则在自定义的脚本代码中应用不到jQuery脚本库。

**三 我的第一个jQuery脚本**

在了解了如何下载和配置jQuery后，我们就来通过一个简单的例子来体验一下jQuery脚本。

应用jQuery弹出一个提示对话框。

1、创建一个名称为JS的文件夹，并将jquery-3.1.1.min.js复制到该文件夹中。

2、创建一个名称为14.01.html的文件，在该文件的<head>标记中引用jQuery库文件，关键代码如下：

<script language="javascript" src="JS/jquery-3.1.1.min.js"></script>

3、编写jQuery代码，实现在页面载入完毕后，弹出一下提示对话框，具体代码如下：

1.  `<script>`
2.  `$(document).ready(function()`
3.  `{`
4.  `alert("我的第一个jQuery脚本！");`
5.  `});`
6.  `</script>`

实际上，上面的代码还可以更简单，也就是将$(document).ready用“$”符代替，替换后的代码如下：

1.  `<script>`
2.  `$(function()`
3.  `{`
4.  `alert("我的第一个jQuery脚本！");`
5.  `});`
6.  `</script>`

**四 运行效果**

![74f3775d-86fb-3218-b2c1-c27040c5a877.png][]

**五 补充说明**

熟悉JavaScript的读者知道，要实现例该效果，还可以通过下面的代码实现：

1.  `<script>`
2.  `window.onload=function()`
3.  `{`
4.  `alert("我的第一个jQuery脚本！");`
5.  `}`
6.  `</script>`

这时，读者可能要问，这两种方法有什么区别，究竟哪种方法更好呢。

下面我们就来介绍二者的区别。window.load()方法是在页面所有的东西都载入完毕后才会执行，例如图片、横幅等。

而$(document).ready()方法则是在DOM元素载入就绪后执行。

在一个页面中可以放置多个$(document).ready()方法，而window.load()方法在页面上只允许放置一个（常规情况）。

这两个方法可以同时在页面中执行，两者并不矛盾。不过，$(document).ready()方法比window.load()方法载入更快。

[0a272df4-64a7-3691-a278-1478e8398a15.png]: /images/20220512/dd698c67726d40bba6291d183fe09880.png
[74f3775d-86fb-3218-b2c1-c27040c5a877.png]: /images/20220512/a5163d30229c4d4fa532001501bef49a.png

发表评论取消回复

表情：

评论列表（有 0 条评论，203人围观）

还没有评论，来说两句吧...

相关阅读

相关 maven下载安装与配置

[https://blog.csdn.net/m0\_67401228/article/details/126435219][https_blog.csdn.net_m0_67

电玩女神/ 2024年03月17日 21:07/ 0 赞/ 99 阅读

相关 Maven 下载与配置

第一步. 下载Maven 官方地址：[http://maven.apache.org/download.cgi][http_maven.apache.org_downlo

ゞ浴缸里的玫瑰/ 2024年02月18日 18:34/ 0 赞/ 76 阅读

相关 Maven下载与配置

Maven官网链接： https://maven.apache.org/ ![4cf9ec6e9545483eb341285f9fa0ab67.png][] 进入后首页

分手后的思念是犯贱/ 2023年10月09日 17:09/ 0 赞/ 29 阅读

相关 Tomcat 下载安装与配置

本文属于转载。原文地址为：https://www.cnblogs.com/limn/p/9358657.html 一、下载 tomcat下载链接：[https://

布满荆棘的人生/ 2023年06月06日 07:46/ 0 赞/ 21 阅读

相关 jdk下载与配置

1.[点我进入jave jdk 下载][jave jdk] \\2.\\开始操作 ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVp

た入场券/ 2023年02月25日 08:49/ 0 赞/ 45 阅读

相关 Gradle下载与安装配置

一、Gradle下载 1.下载地址 https://services.gradle.org/distributions/ 比如我下载的是gradle-6.7

梦里梦外;/ 2022年12月26日 08:11/ 0 赞/ 798 阅读

相关 jQuery--下载方法

原文网址：[jQuery--下载方法\_IT利刃出鞘的博客-CSDN博客\_jquery怎么下载][jQuery--_IT_-CSDN_jquery] 下载网址其他网

小灰灰/ 2022年11月21日 03:49/ 0 赞/ 193 阅读

相关 Git下载、安装与环境配置

[https://blog.csdn.net/huangqqdy/article/details/83032408][https_blog.csdn.net_huangqqdy

落日映苍穹つ/ 2022年10月09日 00:36/ 0 赞/ 225 阅读

相关 jQuery下载与配置

要在自己的网站中应用jQuery库，需要下载并配置它，下面将介绍如何下载与配置jQuery。一下载jQuery jQuery是一个开源的脚本库，我们可以从它的官方网站（

╰+哭是因爲堅強的太久メ/ 2022年05月12日 00:30/ 0 赞/ 204 阅读

相关 Spring的下载与配置

1. 下载spring开发包下载地址：[https://repo.spring.io/webapp/\/artifacts/browse/simple/Gener

你的名字/ 2021年09月27日 08:58/ 0 赞/ 311 阅读