jQuery是一个javascript库,jQuery凭借着简洁的语法和跨平台的兼容性,极大的简化了js操作DOM、处理事件、执行动画等操作。jQuery强调的理念是:'write less, do more'(写的少,做的多)。
什么是 jQuery?
jQuery就是一个js库,使用jQuery的话,会比使用JavaScript更简单。jQuery官网
js库:把一些常用到的方法写到一个单独的js文件,使用的时候直接去引用这js文件就可以了。(animate.js、common.js)。
这里我们知道了,jQuery其实就是一个js文件,里面封装了一大堆的方法方便我们的开发,因此我们学习jQuery,其实就是学习jQuery这个js文件中封装的一大堆方法。
jQuery 的版本
jQuery的版本有很多,分为:1.x、2.x、3.x。
1.x和2.x版本jquery都不再更新版本了,现在只更新到3.x版本。
版本 | 兼容范围 |
1.x版本 | 能够兼容IE6 / 7 /8浏览器 |
2x版本 | 不兼容IE6 / 7 / 8浏览器 |
3.x版本 | 不兼容IE6 / 7 / 8浏览器,更加的简洁 |
压缩版与未压缩版
名称 | 大小 | 说明 |
jquery.js(开发版) | 约229KB | 完整无压缩版本,主要用于测试、学习和开发 |
jquery.min.js(生产版) | 约31KB | 经过压缩,主要用于产品和项目,基本无可阅读性 |
jQuery 初体验
jQuery不需要安装,直接在页面中引用即可。
<head>
<title>jQuery</title>
<meta charset="UTF-8" />
<script type="text/javascript" src="js/jquery-3.3.1.min.js"></script>
</head>
使用jQuery的三个步骤:
引入jQuery文件
入口函数
功能实现
关于jQuery的入口函数:
- 第一种写法:
$(document).ready(function(){
//执行代码
});
- 第二种写法
$(function(){
//执行代码
});
首先我们得明确一点,在 jQuery 库中, ‘$’ 就是 jQuery 的一个简写形式。
jQuery入口函数与js入口函数对比:
类别 | window.onload | $(document).ready() |
执行时机 | 必须等待网页中所有的内容加载完毕后(包括图片)才能执行 | 网页中所有DOM结构绘制完毕后就执行,并不会等待图片、文件的加载 |
编写个数 | 不能同时写多个,下面的会把上面的覆盖 | 能同时编写多个,两个入口函数互不影响 |
简化写法 | 无 | $(function(){}); |
====================打个广告,欢迎关注====================
QQ: | 412425870 |
csdn博客: | http://blog.youkuaiyun.com/caychen |
码云: | https://gitee.com/caychen/ |
github: | https://github.com/caychen |
点击群号或者扫描二维码即可加入QQ群: | ![]() |
![]() |