jQuery 3教程(一)：jQuery介绍

原文地址：jQuery 3教程(一)：jQuery介绍

Introduction

本系列文章不是介绍基础jQuery语法。关于jQuery基础教程，可以参考W3School的jQuery教程。
目前大部分程序员对于jQuery的使用还停留在1.x版本上，本系列文章将介绍目前最新的jQuery3.x。

jQuery是什么？

提到jQuery，就不得不提JavaScript，JavaScript曾经和VBScript一样，作为浏览器脚本语言使用，在那个标准匮乏的年代，一度濒临死亡。不过好在Ajax的出现，大大改善了网页的用户体验，同时也拯救了JavaScript。
而今天JavaScript不仅打败了同时期的VBScript，成为前端脚本语言的霸主，甚至出现了Node.js这种用JavaScript实现的后端服务器，性能完爆Apache, 甚至不输给Nginx，前几年甚至成为了github上的最热门的项目之一。
言归正传，jQuery是什么呢？简单来说，就是一个JavaScript的三方库，用于简化浏览器端的脚本编程。
jQuery能做的事实际上不仅仅是简化脚本编程，使用jQuery可以缩小HTML文件的体积，可以让Ajax交互更简单，甚至可以避免因浏览器兼容性导致的问题（IE浏览器在这个问题上简直是大坑）。
记住jQuery的哲学：Write less, do more.（写的更少，做的更多）

一个jQuery的Demo

在没有jQuery以前，为了知道哪一个选择框被选中，你的代码可能是这么写的：

var value;
var radioGroup = document.getElementsByTagName('radioGroup');
for (var i = 0; i < radioGroup.length; i++) {
  if (radioGroup[i].type === 'radio' && radioGroup[i].name === 'jQuery' && radioGroup[i].checked) {
    value = radioGroup[i].value;
    break;
  }
}

而有了jQuery，你只需要：

var value = jQuery('input:radioGroup[name="jQuery"]:checked').val();

是不是简洁了很多？

jQuery版本

jQuery可以在jQuery CDN下载，下面给出不同浏览器对jQuery版本的支持程度：

浏览器	jQuery 1	jQuery 2	jQuery 3	jQuery Compat 3
IE	6+	9+	9+	8+
Chrome	支持	支持	支持	支持
Firefox	支持	支持	支持	支持
Safari	5.1+	5.1+	7.0+	7.0+
Opera	支持	支持	支持	支持
iOS	6.1+	6.1+	7.0+	7.0+
Android 2.x	2.3	2.3	2.3	2.3
Android 4.x	4.0+	4.0+	4.0+	4.0+

IE挺坑的，对吧？下面来介绍下jQuery的版本：

1. jQuery 1
   这个版本是兼容性最强的，但是由于出生在战火纷飞的年代，体积和性能并不太好，尤其是参与了浏览器兼容性大战，导致很多的trick。

2. jQuery 2
   诞生于2013年4月，和平年代的产物，开始侧重现代浏览器的优化，但是由于牺牲了IE的兼容性，大部分程序员不会使用。

3. jQuery 3
   诞生于2014年12月，jQuery Foundation一看，大家怎么还在用jQuery 1啊？那么就拆除两个版本吧，jQuery 3，适用于现代浏览器，jQuery Compat 3，适用于历史浏览器（其实就是老IE）。

当然，jQuery 3优于jQuery 2，jQuery Compat 3优于jQuery 1。
经过jQuery Foundation这么一折腾，其实程序员更迷惑了，那到底用哪个版本啊？
其实可以根据你的应用场景来选择：

1. 企业内部：必须jQuery 3啊，为了证明我们是前卫的程序员。什么？浏览器不兼容？IT去看看，帮他装个浏览器。

2. 企业外部：必须jQuery 1啊，吸引客户，谁知道客户用的是什么操作系统，什么浏览器。

3. 非IE用户：jQuery 3吧，对于用IE的用户，给他挂个banner：请不要使用IE浏览器。

4. 手机客户端：可以jQuery 3了，用iOS的谁不换新的？

5. 历史网站维护：jQuery 1吧，谁知道用的三方库里面有没有坑。