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插件HighCharts绘制简单2D柱状图效果示例【附demo源码】
Mar 21 jQuery
jQuery列表检索功能实现代码
Jul 17 jQuery
简单实现jquery隔行变色
Nov 09 jQuery
jQuery动态添加li标签并添加属性和绑定事件方法
Feb 24 jQuery
jQuery实现鼠标点击处心形漂浮的炫酷效果示例
Apr 12 jQuery
JS与jQuery实现ListBox上移,下移,左移,右移操作功能示例
May 31 jQuery
jQuery实现table表格信息的展开和缩小功能示例
Jul 21 jQuery
jQuery+Datatables实现表格批量删除功能【推荐】
Oct 24 jQuery
非常实用的jQuery代码段集锦【检测浏览器、滚动、复制、淡入淡出等】
Aug 08 jQuery
jQuery实现提交表单时不提交隐藏div中input的方法
Oct 08 jQuery
jquery 插件重新绑定的处理方法分析
Nov 23 jQuery
JS实现选项卡插件的两种写法(jQuery和class)
Dec 30 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/10/09 PHP
基于php中使用excel的简单介绍
2013/08/02 PHP
php实现通用的信用卡验证类
2015/03/24 PHP
详解PHP神奇又有用的Trait
2019/03/25 PHP
表单元素事件 (Form Element Events)
2009/07/17 Javascript
jQuery 处理网页内容的实现代码
2010/02/15 Javascript
再谈querySelector和querySelectorAll的区别与联系
2012/04/20 Javascript
Java 正则表达式学习总结和一些小例子
2012/09/13 Javascript
原生javascript图片自动或手动切换示例附演示源码
2013/09/04 Javascript
jQuery增加自定义函数的方法
2015/07/18 Javascript
javascript+css3 实现动态按钮菜单特效
2016/02/06 Javascript
实践中学习AngularJS表单
2016/03/21 Javascript
JavaScript实战之菜单特效
2016/08/16 Javascript
js实现文字截断功能
2016/09/14 Javascript
基于node.js依赖express解析post请求四种数据格式
2017/02/13 Javascript
微信小程序实现缓存根据不同的id来进行设置和读取缓存
2017/06/12 Javascript
微信小程序实现点击按钮修改文字大小功能【附demo源码下载】
2017/12/06 Javascript
javascript匿名函数中的'return function()'作用
2018/10/15 Javascript
AngularJS实现的自定义过滤器简单示例
2019/02/02 Javascript
详解新手使用vue-router传参时注意事项
2019/06/06 Javascript
JS实现提示框跟随鼠标移动
2019/08/27 Javascript
微信小程序实现左侧滑动导航栏
2020/04/08 Javascript
浅谈layui 表单元素的选中问题
2019/10/25 Javascript
使用Python的Bottle框架写一个简单的服务接口的示例
2015/08/25 Python
Python中如何获取类属性的列表
2016/12/26 Python
对pytorch网络层结构的数组化详解
2018/12/08 Python
浅谈python之自动化运维(Paramiko)
2020/01/31 Python
Python中的Cookie模块如何使用
2020/06/04 Python
Django DRF APIView源码运行流程详解
2020/08/17 Python
九年级历史教学反思
2014/01/27 职场文书
会计做账心得体会
2016/01/22 职场文书
门面租赁合同范文
2019/08/06 职场文书
一文读懂go中semaphore(信号量)源码
2021/04/03 Golang
使用pandas生成/读取csv文件的方法实例
2021/07/09 Python
MySQL 数据类型详情
2021/11/11 MySQL
vue 把二维或多维数组转一维数组
2022/04/24 Vue.js