jQuery简介_动力节点Java学院整理


Posted in jQuery onJuly 04, 2017

江湖传言,全世界大约有80~90%的网站直接或间接地使用了jQuery。鉴于它如此流行,又如此好用,所以每一个入门JavaScript的前端工程师都应该了解和学习它。

jQuery这么流行,肯定是因为它解决了一些很重要的问题。实际上,jQuery能帮我们干这些事情:

  • 消除浏览器差异:你不需要自己写冗长的代码来针对不同的浏览器来绑定事件,编写AJAX等代码;
  • 简洁的操作DOM的方法:写$('#test')肯定比document.getElementById('test')来得简洁;
  • 轻松实现动画、修改CSS等各种操作。

jQuery的理念“Write Less, Do More“,让你写更少的代码,完成更多的工作!

jQuery版本

目前jQuery有1.x和2.x两个主要版本,区别在于2.x移除了对古老的IE 6、7、8的支持,因此2.x的代码更精简。选择哪个版本主要取决于你是否想支持IE 6~8。

从jQuery官网可以下载最新版本。jQuery只是一个jquery-xxx.js文件,但你会看到有compressed(已压缩)和uncompressed(未压缩)两种版本,使用时完全一样,但如果你想深入研究jQuery源码,那就用uncompressed版本。

使用jQuery

使用jQuery只需要在页面的<head>引入jQuery文件即可:

<html>
<head>
  <script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
  ...
</head>
<body>
  ...
</body>
</html>

好消息是,当你在学习这个教程时,由于网站本身已经引用了jQuery,所以你可以直接使用:

'use strict';
alert('jQuery版本:' + $.fn.jquery);

$符号

$是著名的jQuery符号。实际上,jQuery把所有功能全部封装在一个全局变量jQuery中,而$也是一个合法的变量名,它是变量jQuery的别名:

window.jQuery; // jQuery(selector, context)
window.$; // jQuery(selector, context)
$ === jQuery; // true
typeof($); // 'function'

$本质上就是一个函数,但是函数也是对象,于是$除了可以直接调用外,也可以有很多其他属性。

注意,你看到的$函数名可能不是jQuery(selector, context),因为很多JavaScript压缩工具可以对函数名和参数改名,所以压缩过的jQuery源码$函数可能变成a(b, c)。

绝大多数时候,我们都直接用$(因为写起来更简单嘛)。但是,如果$这个变量不幸地被占用了,而且还不能改,那我们就只能让jQuery把$变量交出来,然后就只能使用jQuery这个变量:

$; // jQuery(selector, context)
jQuery.noConflict();
$; // undefined
jQuery; // jQuery(selector, context)

这种黑魔法的原理是jQuery在占用$之前,先在内部保存了原来的$,调用jQuery.noConflict()时会把原来保存的变量还原。

jQuery 相关文章推荐
jQuery Masonry瀑布流布局神器使用详解
May 25 jQuery
jQuery 表单序列化实例代码
Jun 11 jQuery
基于jquery日历价格、库存等设置插件
Jul 05 jQuery
自定义类似于jQuery UI Selectable 的Vue指令v-selectable
Aug 23 jQuery
详解jquery插件jquery.viewport.js学习使用方法
Sep 08 jQuery
jQuery结合jQuery.cookie.js插件实现换肤功能示例
Oct 14 jQuery
Vue CLI3.0中使用jQuery和Bootstrap的方法
Feb 28 jQuery
JavaScript前端页面搜索功能案例【基于jQuery】
Jul 10 jQuery
jQuery zTree树插件的使用教程
Aug 16 jQuery
jquery实现购物车基本功能
Oct 25 jQuery
JQuery样式与属性设置方法分析
Dec 07 jQuery
jQuery编写QQ简易聊天框
Aug 27 jQuery
jQuery查找和过滤_动力节点节点Java学院整理
Jul 04 #jQuery
jQuery动画_动力节点节点Java学院整理
Jul 04 #jQuery
jQuery实现点击关注和取消功能
Jul 03 #jQuery
关于jQuery.ajax()的jsonp碰上post详解
Jul 02 #jQuery
jquery实现一个全局计时器(商城可用)
Jun 30 #jQuery
jQuery表单设置值的方法
Jun 30 #jQuery
jQuery开源组件BootstrapValidator使用详解
Jun 29 #jQuery
You might like
PHP安全配置
2006/12/06 PHP
file_get_contents获取不到网页内容的解决方法
2013/03/07 PHP
PHP删除目录及目录下所有文件的方法详解
2013/06/06 PHP
php curl模拟post提交数据示例
2013/12/31 PHP
php curl请求信息和返回信息设置代码实例
2015/04/27 PHP
php+mysql实现简单登录注册修改密码网页
2016/11/30 PHP
收集的10个免费的jQuery相册
2011/02/26 Javascript
基于jquery的lazy loader插件实现图片的延迟加载[简单使用]
2011/05/07 Javascript
JS获取url链接字符串 location.href
2013/12/23 Javascript
利用JavaScript检测CPU使用率自己写的
2014/03/22 Javascript
javascript实现依次输入input自动定焦
2014/12/23 Javascript
js控制TR的显示隐藏
2016/03/04 Javascript
EsLint入门学习教程
2017/02/17 Javascript
AngularJS 霸道的过滤器小结
2017/04/26 Javascript
JavaScript实现换肤功能
2017/09/15 Javascript
Vue 中批量下载文件并打包的示例代码
2017/11/20 Javascript
详解如何理解vue的key属性
2019/04/14 Javascript
JavaScript实现的3D旋转魔方动画效果实例代码
2019/07/31 Javascript
Vue学习笔记之计算属性与侦听器用法
2019/12/07 Javascript
JS实现轮播图效果
2020/01/11 Javascript
JavaScript 防抖和节流遇见的奇怪问题及解决
2020/11/20 Javascript
跟老齐学Python之编写类之三子类
2014/10/11 Python
Python列表(list)、字典(dict)、字符串(string)基本操作小结
2014/11/28 Python
python从网络读取图片并直接进行处理的方法
2015/05/22 Python
在win和Linux系统中python命令行运行的不同
2016/07/03 Python
深入理解NumPy简明教程---数组3(组合)
2016/12/17 Python
python生成随机图形验证码详解
2017/11/08 Python
解决PyCharm同目录下导入模块会报错的问题
2018/10/13 Python
python3字符串操作总结
2019/07/24 Python
EJB3推出JPA的原因
2013/10/16 面试题
培训主管的岗位职责
2013/11/23 职场文书
先进事迹报告会感言
2014/01/24 职场文书
置业顾问岗位职责
2014/03/02 职场文书
学校运动会广播稿范文
2014/10/02 职场文书
Python3 如何开启自带http服务
2021/05/18 Python
Win10 Anaconda安装python-pcl
2022/04/29 Servers