我是靠谱客的博主 迅速小蝴蝶,最近开发中收集的这篇文章主要介绍[jQuery]jQuery的安装,觉得挺不错的,现在分享给大家,希望可以做个参考。

概述

jQuery是一个JavaScript的函数库,利用它我们可以便捷地使用一些javascript实现比较复杂的操作。
下面介绍三种引用jQuery库的方法

本地直接下载

我们可以访问 http://jquery.com/download/ 进行下载

有两个版本的 jQuery 可供下载:

  • Production version - 用于实际的网站中,已被精简和压缩。
  • Development version - 用于测试和开发(未压缩,是可读的代码)

在这里我们以未压缩的代码为例,将其下载到指定的目录下:

这里写图片描述

在html文件里引用下载好的jQuery,代码如下:

<html>
<head>
<script type="text/javascript" src="jquery-3.3.1.js"></script>
<script type="text/javascript">
$(document).ready(function(){
  $("button").click(function(){
    alert('jQuery已经成功调用');
});
});
</script>
</head>
<body>
<button type="button">Click me</button>
</body>
</html>

效果图如下,证明已经成功调用

这里写图片描述

npm间接下载

首先打开终端(Terminal)cd到测试的文件夹下

这里写图片描述

执行

cnpm install jquery

这里写图片描述

打开Finder可以发现有一个名为node_modules的文件夹生成

这里写图片描述

那么,具体下载下来的jQuery文件在哪里呢?让我们继续寻找

这里写图片描述

如上图 我们下载好的jQuery.js放置在node_modules/jquery/dist下

由此,把测试代码改成

<script type="text/javascript" src="node_modules/jquery/dist/jquery.js"></script>

经检验,可以成功调用jQuery.js

内容分发网络

各大科技公司的服务器都存有jQuery,我们可以通过CDN引用它,许多用户在访问其他站点时,已经用CDN加载过 jQuery。所有结果是,当他们访问您的站点时,会从缓存中加载 jQuery,这样可以减少加载时间。同时,大多数 CDN 都可以确保当用户向其请求文件时,会从离用户最近的服务器上返回响应,这样也可以提高加载速度。

当前可以的路径有:

Google:
http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js(国内慎用)

Microsoft:
http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.7.2.min.js(国内慎用)

sina:
http://lib.sinaapp.com/js/jquery/1.7.2/jquery.min.js

code.jquery.com:
http://code.jquery.com/jquery-1.11.1.min.js

相应的引用代码换成:

<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>

经检验,该方法可以引用jQuery库

注:由于JavaScript 是 HTML5 以及所有现代浏览器中的默认脚本语言,所以方法一和二引用语句里的

type="text/javascript"

可以忽略掉

完。

最后

以上就是迅速小蝴蝶为你收集整理的[jQuery]jQuery的安装的全部内容,希望文章能够帮你解决[jQuery]jQuery的安装所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。

本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
点赞(35)

评论列表共有 0 条评论

立即
投稿
返回
顶部