jQuery零基础入门——（一）初识jQuery

最新推荐文章于 2024-08-30 20:29:15 发布

weixin_33890526

最新推荐文章于 2024-08-30 20:29:15 发布

阅读量65

点赞数

文章标签： javascript python ViewUI

原文链接：https://my.oschina.net/JandenMa/blog/1837384

版权

2019独角兽企业重金招聘Python工程师标准>>>

《jQuery零基础入门》系列博文是在廖雪峰老师的博文基础上，补充了个人的理解和日常遇到的点，主干出处来自廖雪峰老师的技术分享。

大家好，欢迎来到我们新的课程。应部分读者的要求，为满足不同学习能力的初学者，在推《JavaScript零基础入门》系列博文的同时，也穿插分享一下JavaScript江湖上广为人知的武林至尊——jQuery。今天，我们先来了解一下这神秘之物的基本信息。

jQuery，是JavaScript江湖上，被广泛使用的一个库。据江湖上不完全统计，世界上约有八成左右的网站，直接或间接的使用jQuery作为原生JS的替代品，来提高开发效率。这么神秘又强大的东西，值得我们来一探究竟。

jQuery的理念

jQuery一直用”Write Less, Do More“来宣传自己，意思是，写更少的代码，做更多的事情，体现其简洁高效的特性。

jQuery的优点

简洁的操作DOM的方法：

document.getElementById("a") => document.querySelector("#a”） => $("#a")；
document.getElementsByTagName("span") => document.querySelectorAll("span”） => $("span")；
document.getElementsByClassName("css") => document.querySelectorAll(".css”） => $(".css")。

消除浏览器差异：

对于一些事件和样式，不需要写一堆代码来兼容或适应不同浏览器，当然也包含AJAX。

快速修改CSS样式，轻松实现动画效果。

jQuery的版本

截至目前，jQuery已经更新到3.3.1，换句话说，当前的jQuey存在1.x、2.x和3.x三个大版本，需要注意的是，2.0以上版本，已经不再支持IE6/7/8，因此2.0+的版本，代码会更精简，当然也不是最新的版本就是好的，要根据项目需求来选择合适的版本，如果你想支持IE6/7/8，还得用1.x。

另外，我们可以从jQuery官网直接下载jQuery的最新版本，也可以从jQuery CDN找到历史版本。一般来说，我们这些版本文件，只是一个js或min.js文件，js文件是一个未压缩的开发环境使用的版本，我们可以看到源码，而min.js是被压缩过的生产环境（也就是正式环境）使用的版本，基本上已经被压缩、混淆和加密过。不过，使用效果没什么区别。

jQuery的使用

在使用jQuery之前，我们可以先决定是要使用CDN版本还是本地版本，两者的区别就是，本地版本就是将jQuey文件下载到本地，CDN版本其实就是网络版，用的时候浏览器会自己去对应的位置调用。不管是用哪一种，我们都需要在页面上引用jQuery文件，以CDN版本为例，本地版本就把src指向本地已下载好的文件即可：

<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
	</head>
	<body>
		
	</body>
</html>

jQuery的$符

$符号除了因美元而被人熟知外，在IT世界，它就是著名的jQuery符号。在jQuey中，其实所有的方法对被封装在一个全局变量里，这个全局变量就是jQuery，而$作为jQuery中一个合法的变量名，同时也是jQuery的别名，也就是说jQuery===$的结果是true。

需要说明的是，一般情况下，我们可以直接用$替代jQuery来调用，但如果$被其他代码先声明占用了，而且没办法改的时候，我们只能调用jQuery.noConflict()来解放$符，而调用之后，就只能乖乖使用jQuery了，$不再是jQuery的替身了。

转载于:https://my.oschina.net/JandenMa/blog/1837384