jQuery框架

参考《基于jQuery的Web前端组件开发研究与应用》

jQuery框架概述

  jQuery是一个完善且性能优秀的JavaScript库，由John Resig创立于2006年1月的开源项目。其含义是Javascript和查询，是一个辅助前端组件开发的JS库。主要强调其查找网络元素，并通过JavaScript来进行这些元素的操作，Jquery有很多优点，使用了一致性与对称性等设计原则。
  jQuery依靠其简洁的语法和完美的兼容性使用户能很轻松地处理HTML、操作对象元素、处理前端事件、实现组件的变换等，且可以很简单地给网站应用提供AJAX交互。jQuery的功能很全，使用说明也很详细，同时还有很多开发完善的插件可以使用。jQuery可以让用户的HTML的页面的代码和其内容分离，也就是说，我们无需再HTML文件中插入javaScript代码来调用脚本，只需要通过定义id就可实现。
  现在，jQuery已经成为全球最为广泛使用的JS库，在全球前一万个访问量最高的网站中，有一半以上的网站正使用jQuery。

jQuery框架特点

  jQuery功能完善且性能强大，只需少量代码即可完成大量JavaScript原生代码才能完成的工作。jQuery 独有的选择器、简单易懂的链式操作、全面的事件处理机制和封装完善的Ajax都是使得jQuery强大的元素。概括起来，jQuery有以下特点：

• 轻量级

  jQuery相当轻便，使用UglifyJS进行压缩后，整个jQuery框架文件大小大概在300k，jQuery一直在寻找最合适的压缩方式来使得jQuery变得轻便，所以jQuery的压缩工作也一直在变化，从最早采用的Packer到后来使用Closure Compiler进行压缩，最后到目前使用UglifyJS进行压缩。

• 强大的选择器

  jQuery允许开发者使用从CSS1到CSS3几乎所有的选择器，以及jQuery独创的高级而复杂的选择器。另外还可以加入插件使其支持xPath选择器，甚至开发者可以编写属于自己的选择器。jQuery中的选择器完全继承了CSS风格。利用jQuery选择器，可以非常便捷和快速地找出特定的DOM元素，然后为它们添加相应的行为，而无需担心浏览器是否支持这一选择器。jQuery的行为规则都必须在获取到元素后才能生效。
  我们以最主要的“$”为例，其不但支持DOM的选择方式，而且支持CSS和XPath两种选择器，并提供了很多自定义的选择方式使得其解耦性非常灵活，使得元素的查找变得简单方便，降低了开发的复杂度。“$" 在很多JavaScript类库中都被作为一个选择器函数来使用，在jQuery中也不例外。其中，$(“ID”)可以用来代替document.getElementById()函数，即通过ID获取元素；$(“tagName”)可以用来代替documem.etElementsByTagName()函数，即通过标签名获取HTML元素。与传统写法相比简洁许多，即使没有注释代码的情况下也能较好地理解，大大提高了开发效率。
  jQuery选择器支持CSS1、CSS2的全部和CSS3的部分选择器，同时它也有少量独有的选择器，因此对于有一定CSS开发基础的人来说，jQuery上手则显得较为简单，而且使用CSS选择器时，开发人员需要考虑主流浏览器是否支持某些选择器。而在jQuery中，开发人员则可以放心地使用jQuery选择器而无需考虑浏览器是否支持这些选择器。

• 出色的DOM操作的封装

  jQuery封装了大量常用的DOM操作，使开发者在编写DOM操作相关程序的时候能够得心应手。jQuery自己轻松地完成了各种原本非常复杂的操作，使得开发者在使用时能够省去不必要的大量重复劳动。

• 可靠的事件处理机制

  jQuery的事件处理机制吸收了JavaScript专家Dean Edwards编写的事件处理函数的精华，使得jQuery在处理事件绑定的时候相当可靠。在预留退路(graceful degradation)、循序渐进以及非入侵式(Unobtrusive)编程思想方面，jQuery也做得非常不错。

• 完善的Ajax

  jQuery将所有的qax操作封装到一个函数$.ajax()里，使得开发者在处理Ajax的时候不用操心多于的浏览器兼容性而能够全心完成业务逻辑XMLHttpRequest对象的创立以及运用。

• 不污染项级变量

  jQuery只建立一个名为jQuery的对象，将全部方法放于该对象之下。另外一个名称$也是可以随时交出使用权的。保证不会污染其它的对象。

• 良好的浏览器兼容

  jQuery是一个广泛使用的JaVaScript库，浏览器的兼容性是最基本的要求。jQuery能够在IE6.0+、FF2+、Safari2.0+和Opera9.0+下正常运行。并且修复了一些浏览器之间的差异。使你不用在研发项目前为浏览器兼容问题担心。

• 链式操作方式

  jQuery中很大的一个特色就是其链式操作方式——就是对同一个jQuery上对象上发生的一组操作，可以直接将操作连续写出而无需重复获取对象。这一点使jQuery的代码变得简单易懂。
  以一个实际的代码为例：

$("#new").addClass("current").next().show().parent().siblings().("current").next().hide();

  这旬代码的作用是，获取ID为new的元素，给其添加一个名为current的class，然后将其紧邻其后面的元素显示出来，同时将它的父辈同辈元素内部的子元素都去掉一个名为current的class，并且将紧邻它们后面的元素都隐藏。
  这句代码就完成了导航栏的功能，这就是jQuery强大的链式操作。