使用_jQuery（中级）_第_1_部分_使用插件创建和扩展_jQuery_函数 精品资料.doc

使用jQuery（中级），第1部分:使用插件创建和扩展jQuery函数2009年4月20日jQuery的流行在很大程度上应该归功于其将插件架构包括进来的决定。这个决定让任何一位第三方开发人员都能超越最初的库函数创建并扩展jQuery函数。结果所产生的这数百个插件几乎能够提供一个Web应用程序内所需的任何一种函数。本文介绍了这个插件架构并解释了jQuery是如何让Web应用程序表现得与桌面应用程序一模一样。简介自我发表了有关jQueryJavaScript库的第一个系列文章（参见参考资料）的这六个月来，在jQuery领域发生了很多事情。对我们这些jQuery的信徒而言，最令人激动的莫过于Microsoft®已经选择在其VisualStudio套件中使用jQuery，并已经决定将jQuery作为目前该套件所包含的惟一的JavaScript库。这显示了对jQuery的极大支持，帮助巩固了jQuery作为适用于Web应用程序的领先JavaScript库的地位。jQuery受欢迎程度不断攀升的另一个有力说明是更新后的GoogleTrends图。我在之前的一篇文章中介绍过该图表，它展示了jQuery已经开始渐渐地从备用的这些JavaScript库中脱离出来。而六个月后，这种脱离更为明显，这一点从图1和图2（忽略了12份类似股票市场的下跌）所示的这两个更新后的Google趋势图中可以看出。图1.2008年6月常用JavaScript库的Google趋势图图2.2009年1月常用JavaScript库的Google趋势图在这个由五篇文章组成的系列文章中，我将更进一步，讨论在使用jQuery中涉及到的一些属于中等级别的主题。该系列涵盖的主题包括插件及插件的开发、jQueryUI程序包、创建jQuery小部件的一些较高深的主题、更先进的AsynchronousJavaScript+XML(Ajax)技术，最后，还会对比JavaScript及其他库来介绍jQuery的性能。本系列中的第一篇文章将讨论jQuery中所使用的插件结构。插件是jQuery比其他JavaScript库发展速度更快的最主要原因。由于插件广受第三方开发人员忠爱，到目前为止，已经有上百个插件被开发出来，极大地丰富了jQuery功能。插件，从名字的字面意义不难看出，就是为了扩展jQuery的核心下载所固有的功能而“插入”到jQuery的小部件或代码模块。插件社区已经开发出了上百个插件，这没有丝毫的夸大。无论您的Web站点遇到了什么问题，无论您（或您的客户）需要何种小部件，您都有可能在jQuery插件库中找到解决的办法。而且，插件库内所有的插件都是可免费下载并能在您自已的Web站点上使用的。插件并不只限于用户界面小部件，此外还包括对jQuery语法的扩展、额外的Ajax函数以及人们改进其开发过程所需要的其他一些创新。更酷的是人们已经将几个内置的JavaScript特性（例如，线程特性setTimeout()及setInterval()）转换成了jQuery语法。这就为开发人员提供了一个纯jQuery的开发环境，使处理与维护都更为轻松。插件jQuery插件结构有很多优点。首先，它让您能够只使用jQuery核心以外的那些想要使用的小部件及函数。这在Web应用程序中非常重要，因为每附加一个插件都意味着下载和流量的增加。通过允许您只使用那些希望使用的插件，您就可以更好地管理Web流量。其次，它使那些热情高涨的第三方开发人员可以创建自已感兴趣的小部件并通过创建他们自已的插件来改进jQuery函数，而不必尝试通过jQuery核心代码来实现其想法。这使得jQuery的使用者能用集体的创造力和创造热情来扩展这个库，这样一来，新想法和新小部件的增长潜力几乎是无限的。这一点与封闭式的结构完全相反，后者需要jQuery团队审查和批准每个插件，这无疑会导致创建瓶颈。第三，这个由jQuery团队创建的插件架构，无论是对创建插件还是对使用插件的开发人员而言，用起来都很方便，这也是插件能够飞速发展的重要动力。然而，除了这些优点之外，也有一个不好的方面：这些插件没有正式的测试结构。因此，虽然可以放心jQuery核心已经被仔细测试过，但是如若选择使用了一个插件，也只能依靠第三方对其进行测试了。对于一个十分关键的Web应用程序而言，这个缺点应被予以重视。要使用一个插件，需要将其放在您的页面上，与对任何JavaScript文件所做的（包括jQuery文件本身）无异。因此，如果需要在页面上使用一个插件，可以将其添加在jQuery之后，如清单1所示。清单1.如何包含一个插件<scriptsrc="jquery-1.2.6.min.js"type="text/javascript"></script><scriptsrc="j