Think In jQuery jQuery插件下载

[复制链接]

独孤青

83 主题	3 听众	217 积分

管理员

Rank: 75

性别: 男
听众数: 3
买家信用
卖家信用
在线时间: 111 小时
相册: 0

发表于 2011-9-4 22:39:00 |显示全部楼层

大部分情况下，我们面临的背景是：
设计者高高在上，不食人间烟火，只是提供约束，不要这样，必须那样，而不是提供方法和可以复用的API。
开发者是处于解决问题的一线，饱尝重复造轮子的疾苦，他们最需要的是快速的解决问题，以更恰当的方式工作，寻找更容易构建系
统的技术和方式。
jquery给设计者上了很好的一课。
Jquery就像一个魔法师一样，$()就像魔法棒一样，随手一指，一个木偶变复活了，一瞬间具备了各种各样的复杂的能力。

1）分离和粘合
在jquery的身上得到淋漓的体现。不仅是分离结构(structure)和行为功能(behaviour)，在强调分离的同事，提供了强大的连接、粘
合的能力。
1.结构  <div id="div_portlet"></div>
2.功能  function  tooltip(){}
3.粘合 $("#div_portlet" ).tooltip();  //对于开发者，一行代码就达到设计上的分层分离和功能实现两个目标了。
同样是使用传统的javacript library, 所谓OO的做法如下：
<script> var tootip = new Tooltip(); //创建OO对象</script>
<div id="div_portlet"  ></div>
两者对比，可以看出，Jquery非常非常的体贴开发者，通过强内聚的API的设计，封装，再封装，一个方法包办了onmouseover和onmouseout两个事件，擦屁股的事情也解决了。
想象以前，是怎么给一个table或DIV做圆角的，很多的方案是CSS+圆角图片，很麻烦，图片的背景还要符合页面环境的颜色。
jquery是怎么做的：$("#div_portlet" ).corner(); //搞定，不需要CSS，不需要图片。

2）封装，封装，再封装
   Write less. Do more，是Jquery的口号。
   也应当是每个设计者设计API牢记的，API的设计宗旨就是要，苦了我一个，幸福无数人的精神。
   有人说，Jquery的代码太乱，真是有闲工夫，我还在Javaeye论坛上，见过别人说Spring的代码乱，还有人说JBPM的代码像一托屎。这些伟大的框架，都是自己封装了复杂度，竭力把最简洁的API留给使用者，让你专注于自己该做的事情。换来的却是责难。
   可惜的是，我们用别人的库是，总是要做一大堆的事情，才完成一个复杂的功能。
   例如我们在显示Flash Object时，使用swfObject.js 需要完成的代码是：

<script type="text/javascript">
var so = new SWFObject("../open-flash-chart/open-flash-chart.swf", "ofc", "250", "200", "9", "#FFFFFF");
so.addVariable("data-file", "../data-files/data-60.txt");
so.addParam("allowScriptAccess", "always" );//"sameDomain");
so.write("my_chart");
</script>
   同样使用JQuery jQuery Flash Plugin,一条代码就搞定了。
   $('#hello').flash(
      { src: 'hello.swf' },
      { expressInstall: true }
   );

3)  充分利用倒钩(hook)、回调(callback) 定制行为

   在API的默认behaviour不能满足要求的前提下，使用hook、callback，可以让API的调用者，可以尽最大程度的定制自己、添
加自己的特殊行为。Jquery的core、Plug-in，都大量的使用了这种技巧。
   如：$("div_content").toggle(); // 默认是切换hide 和 dispaly 两者行为。
   如果你想在切换时，做一点其他的事情。如通知另一个控件。
   可以：$("div_content").toggle(function(){
            //可以发送消息，或出发事件。
   });

4) 减少代码的行数是降低复杂度的最有效方式

http://www.netvibes.com  是一个portal网站，它的portal使用了Mootool的javascript框架,  javascript的总行数将近6万行。
Mootool的OO确实做的很好，号称适合在大型、复杂的应用中使用，可惜在复杂的应用当中，过度的OO，并不能提供简洁的功能，继承的滥用反而增加了复杂度和维护的难度。
我down下来代码后，看了看，觉得如果使用Jquery，代码最少能缩小一半。

如果你一定要坚持你的应用是大型的javascript应用（尽管没有标准衡量），你就喜欢Class，看不到这个单词，你就不爽。看看下面的文字。

5). OO和JQuery的结合
很多人并不了解OO，对于OO不过是叶公好龙吧了，以为OO，就是一定要出现个Class, 然后在不断的new 来new去，这就是OO的编程
。本来一个Utility的方法，非要OO，结果先要new一个Object, 然后在调用Ojbect的方法。
  OO是这样子吗？当然不是，封装、继承、多态，是OO的核心。
  OO的编程虽然可以帮助用户开发高度有弹性、易扩展、以维护的程序，但前提是要理解OO。
  如果我们不满足于使用Jquery的API、plug-in的功能，我们想用它来作为我们开发大型OO-based 项目的基础javascript框架时，
我们仍然可以通过plug-in的方式，让JQuery具有OO编程的基础框架的功能。
Low Pro for jQuery 是一个模拟prototye OO 的Jquery plug in,  是你可以用Prototype的OO方式编程。
使用插件前的API的调用方式
   $('#example4').draggable({ helper: 'clone', revert: true });
假设我们遇到了复杂的情况，想改变draggable的情况，这是只有修改源文件了。
使用插件后，我们可以通过类，继承类来改变对象的行为。
  Draggable = $.klass({
   initialize: function(options) { },
   onmousedown: function() {}
});
通过继承来扩展对象的行为：
GhostedDraggable = $.klass(Draggable, {
onmousedown: function($super) {
      $super();
   //此处可以编写自定义的行为代码
}
});
然后通过attach的方法绑定到制定的DIV上：
$('div.product').attach(GhostedDraggable, { anOption: thing });

6).在应用中，尽可能的使用一个框架，便于技术积累。

  Jquery可以满足你大部分的要求，不是做不到，是你不知道, 你不知道Jquery的有这样的能力罢了。