扩展 编写jQuery插件 新方法是通过扩展$.fn对象实现的 $.fn对象绑定变量 $.fn.highlight1 = function () { // this已绑定为当前jQuery对象: this.css('backgroundColor', '#fffceb').css('color', '#d85030'); return this; } 函数内部的this在调用时被绑定为jQuery对象,所以函数内部代码可以正常调用所有jQuery对象的方法 简单的说。新的方法绑定到了jQuery对象中,所以jq对象能使用新方法 我们得出编写一个jQuery插件的原则: 1 给$.fn绑定函数,实现插件的代码逻辑; 2 插件函数最后要return this;以支持链式调用; 3 插件函数要有默认值,绑定在$.fn.<pluginName>.defaults上; 4 用户在调用时可传入设定值以便覆盖默认值。 扩展jQuery对象的功能十分简单 但是我们要遵循jQuery的原则,编写的扩展方法能支持链式调用、具备默认值和过滤特定元素,使得扩展方法看上去和jQuery本身的方法没有什么区别。 链式调用:函数最后 return this;返回jq对象 具备默认值:使用$.extend(target, obj1, obj2, ...) 过滤特性元素:调用filter()// jQuery的filter()参数可以传入css选择器、函数 $.extend(target, obj1, obj2, ...),它把后面多个object对象的属性合并到第一个target对象中,遇到同名属性,总是使用靠后的对象的值,也就是越往后优先级越高 // 把默认值和用户传入的options合并到对象{}中并返回: var opts = $.extend({}, { backgroundColor: '#00a8e6', color: '#ffffff' }, options);