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遍历节点方法汇总(推荐)
May 13 jQuery
jQuery、layer实现弹出层的打开、关闭功能
Jun 28 jQuery
jquery中有哪些api jQuery主要API
Nov 20 jQuery
关于jquery layui弹出层的使用方法
Apr 21 jQuery
通过jquery.cookie.js实现记住用户名、密码登录功能
Jun 20 jQuery
jQuery中$原理实例分析
Aug 13 jQuery
详解JQuery基础动画操作
Apr 12 jQuery
解决jquery validate 验证不通过后验证正确的信息仍残留在label上的方法
Aug 27 jQuery
jQuery利用cookie 实现本地收藏功能(不重复无需多次命名)
Nov 07 jQuery
jQuery实现鼠标滑动切换图片
May 27 jQuery
基于jquery实现彩色投票进度条代码解析
Aug 26 jQuery
jquery插件实现搜索历史
Apr 24 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代码(星期六,星期日总和)
2009/11/12 PHP
ThinkPHP自动转义存储富文本编辑器内容导致读取出错的解决方法
2014/08/08 PHP
smarty内置函数config_load用法实例
2015/01/22 PHP
php实现读取内存顺序号
2015/03/29 PHP
PHP获取文件夹大小函数用法实例
2015/07/01 PHP
详解php设置session(过期、失效、有效期)
2015/11/12 PHP
jQuery ajax BUG:object doesn't support this property or method
2010/07/06 Javascript
AngularJS使用angular.bootstrap完成模块手动加载的方法分析
2017/01/19 Javascript
TypeScript入门-基本数据类型
2017/03/28 Javascript
vue中如何引入jQuery和Bootstrap
2017/04/10 jQuery
微信小程序教程系列之新建页面(4)
2017/04/17 Javascript
基于vue2框架的机器人自动回复mini-project实例代码
2017/06/13 Javascript
vue 粒子特效的示例代码
2017/09/19 Javascript
vue中各选项及钩子函数执行顺序详解
2018/08/25 Javascript
JavaScript学习笔记之基于定时器实现图片无缝滚动功能详解
2019/01/09 Javascript
vue之组件内监控$store中定义变量的变化详解
2019/11/08 Javascript
JavaScript使用百度ECharts插件绘制饼图操作示例
2019/11/26 Javascript
Javascript操作select控件代码实例
2020/02/14 Javascript
[49:42]DOTA2上海特级锦标赛主赛事日 - 3 胜者组第二轮#2Secret VS EG第一局
2016/03/04 DOTA
利用QT写一个极简单的图形化Python闹钟程序
2015/04/07 Python
Python实现单词拼写检查
2015/04/25 Python
python3实现跳一跳点击跳跃
2018/01/08 Python
Python利用Django如何写restful api接口详解
2018/06/08 Python
Python3.5集合及其常见运算实例详解
2019/05/01 Python
python中对数据进行各种排序的方法
2019/07/02 Python
浅析Windows 嵌入python解释器的过程
2019/07/26 Python
django使用graphql的实例
2020/09/02 Python
Python中return函数返回值实例用法
2020/11/19 Python
python制作一个简单的gui 数据库查询界面
2020/11/19 Python
日本高端护肤品牌:Tatcha
2016/08/29 全球购物
高中生自我评价个人范文
2013/11/09 职场文书
新学期开学寄语
2014/01/18 职场文书
青年教师师德演讲稿
2014/08/26 职场文书
2014年妇幼卫生工作总结
2014/12/09 职场文书
发布会邀请函
2015/01/31 职场文书
python基础入门之字典和集合
2021/06/13 Python