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插件FusionCharts实现的3D帕累托图效果示例【附demo源码】
Mar 25 jQuery
为JQuery EasyUI 表单组件增加焦点切换功能的方法
Apr 13 jQuery
jquery平滑滚动到顶部插件使用详解
May 08 jQuery
jQuery异步提交表单实例
May 30 jQuery
基于jQuery实现的Ajax 验证用户名唯一性实例代码
Jun 28 jQuery
jQuery实现html双向绑定功能示例
Oct 09 jQuery
jQuery EasyUI window窗口使用实例代码
Dec 25 jQuery
关于jquery中attr()和prop()方法的区别
May 28 jQuery
jQuery时间戳和日期相互转换操作示例
Dec 07 jQuery
jquery 遍历hash操作示例【基于ajax交互】
Oct 12 jQuery
jQuery操作元素追加内容示例
Jan 10 jQuery
JQuery+drag.js上传图片并且实现图片拖曳
Nov 18 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
sourcesafe管理phpproj文件的补充说明(downmoon)
2009/04/11 PHP
最新用php获取谷歌PR值算法,附上php查询PR值代码示例
2011/12/25 PHP
PHP常用技巧总结(附函数代码)
2012/02/04 PHP
php面向对象程序设计入门教程
2019/06/22 PHP
php ZipArchive实现多文件打包下载实例
2019/10/31 PHP
jquery控制listbox中项的移动并排序的实现代码
2010/09/28 Javascript
jquery插件 autoComboBox 下拉框
2010/12/22 Javascript
JavaScript 判断用户输入的邮箱及手机格式是否正确
2013/12/08 Javascript
JS中操作JSON总结
2020/12/06 Javascript
Bootstrap布局组件应用实例讲解
2016/02/17 Javascript
Bootstrap select实现下拉框多选效果
2016/12/23 Javascript
使用vue.js实现联动效果的示例代码
2017/01/10 Javascript
AngularJs表单校验功能实例代码
2017/02/09 Javascript
基于JS脚本语言的基础语法详解
2017/07/22 Javascript
vue中eventbus被多次触发以及踩过的坑
2017/12/02 Javascript
jQuery动态添加元素无法触发绑定事件的解决方法分析
2018/01/02 jQuery
vue中锚点的三种方法
2018/07/06 Javascript
图文讲解vue的v-if使用方法
2019/02/11 Javascript
Vue自定义全局Toast和Loading的实例详解
2019/04/18 Javascript
javascript实现商品图片放大镜
2019/11/28 Javascript
浅谈在vue-cli3项目中解决动态引入图片img404的问题
2020/08/04 Javascript
python中cPickle用法例子分享
2014/01/03 Python
python实现数通设备端口监控示例
2014/04/02 Python
对Python新手编程过程中如何规避一些常见问题的建议
2015/04/01 Python
Python实现破解12306图片验证码的方法分析
2017/12/29 Python
Python实现最常见加密方式详解
2019/07/13 Python
python pygame实现球球大作战
2019/11/25 Python
pygame实现飞机大战
2020/03/11 Python
使用Keras实现简单线性回归模型操作
2020/06/12 Python
浅谈Python描述数据结构之KMP篇
2020/09/06 Python
教师实习自我鉴定
2013/12/18 职场文书
互联网创业计划书写作技巧攻略
2014/03/23 职场文书
廉政承诺书
2015/01/19 职场文书
《植树问题》教学反思
2016/03/03 职场文书
教你怎么用python selenium实现自动化测试
2021/05/27 Python
实现一个简单得数据响应系统
2021/11/11 Javascript