jQuery为开发插件提拱了两个方法,分别是:
1. jQuery.fn.extend(object); 【对jQuery对象的扩展】包装器方法
例子:
(function($){
$.fn.makeItBlue = function() {
return this.css('color','blue');
}
})(jQuery);
在这里, this代表的是包装集。如果使用this.each方法,那么在each方法中的this则代表DOM元素。
2. jQuery.extend(object); 【对jquery类的扩展】自定义帮助方法
例子:
(function($){
$.say = function(what) { alert('I say '+what); }
})(jQuery);
调用只能以$.say(“are u ok?”)
3. 把握复杂的参数列表
如果一个function含有两个参数,那么判断参数是否没有传入,是一件很容易的事情,我们可以为没有传入的属性赋一个默认值,但是如果有很多参数,比如:
function complex(p1,p2,p3,p4,p5,p6,p7)
我们想要p2保持默认值,而传入p1,p7选项的话,就非常复杂了,需要按照下面的形式调用:
complex(valueA,null,null,null,null,null,valueB)
为了解决这个方法,可以把参数包装成一个JS对象,即
complex(valueA, {p7: valueB});
就可以轻松解决问题了
另外,为了更好的将选项传入function,可以用下面这个方法,更加好的实现,利用$.extend()
function complex(p1,options) {
var settings = $.extend({
option1: defaultValue1,
option2: defaultValue2,
option3: defaultValue3,
option4: defaultValue4,
option5: defaultValue5,
option6: defaultValue6
},options||{});
options||{}是为了避免options为空的情况
这样,默认值就会被options中的值覆盖,其余的将保持默认值
说明:
插件命名规则jquery.插件名.js 例如:jquery.check.js
命名规则不一定需要遵守也可以随意为插件命名. 遵守命名规则可以使你的插件更规范,更容易使人理解。
对于插件中的返回值返回的是jquery对象,返回值不是必须的。
由于不知道使用jQuery的用户是否应用了 $.noConflict() 方法,所以不能直接使用$
根据前面介绍的方法,可以使用以下这个方式:
(function($){
//
// Plugin definition goes here
//
})(jQuery);
分享到:
相关推荐
这篇“jQuery插件开发学习”的主题旨在帮助开发者深入理解如何利用jQuery来开发自定义插件,提高代码复用性和项目效率。下面我们将详细探讨jQuery插件开发的相关知识点。 首先,了解jQuery的核心概念是至关重要的。...
本文详细介绍基于jQuery开发插件的方式及步骤,其中附有代码和说明,是jq插件开发的入门教程。jQuery为开发插件提拱了两个方法,分别是: jQuery.fn.extend(object); 给jQuery对象添加方法。 jQuery.extend(object);...
### jQuery插件开发全解析 #### 一、引言 jQuery作为一款优秀的JavaScript库,在前端开发领域具有举足轻重的地位。它简化了许多常见的JavaScript任务,使得开发者能够更轻松地处理DOM操作、事件处理以及Ajax交互等...
jQuery插件开发及常用插件大全PDF;jQuery插件开发.pdf、jQuery常用插件大全.pdf
标题中的“dreamweaver 安装jquery 开发插件”涉及到的是在Adobe Dreamweaver中安装jQuery开发插件的过程。Dreamweaver是一款流行的Web开发工具,它提供了代码编辑、设计视图以及预览功能,方便开发者创建网页和应用...
**jQuery插件开发** 在Web开发领域,jQuery是一款广泛使用的JavaScript库,它简化了DOM操作、事件处理、动画效果和Ajax交互。jQuery插件是扩展jQuery功能的一种方式,允许开发者根据需求定制各种功能,如表单验证、...
jQuery插件开发是扩展这个库功能的一种常见方式,使得开发者能够根据项目需求创建自定义功能。以下是对jQuery插件开发的详细讲解: 1. **插件基础** - jQuery插件通常是通过扩展jQuery对象的原型链来实现的,这...
4. **兼容性**:由于是基于jQuery开发,所以该插件应具有良好的浏览器兼容性,能够在大部分现代浏览器上正常工作,包括桌面和移动端。 5. **易于集成**:作为一款jQuery插件,它应该提供简单的API接口和配置选项,...
《jQuery插件开发详解》 在Web开发领域,jQuery是一个广泛应用的JavaScript库,它极大地简化了DOM操作、事件处理和动画制作。对于开发者而言,掌握jQuery插件的开发技巧是提升工作效率的重要一环。本篇将深入探讨...
**通用JQuery插件开发详解** 在Web开发领域,jQuery是一个广泛使用的JavaScript库,它极大地简化了DOM操作、事件处理、动画制作以及Ajax交互。由于其简洁的API和丰富的功能,jQuery成为创建交互式网页的强大工具。...
jQuery插件开发是一项重要的技能,可以让开发者通过创建可复用的代码片段来增强jQuery库的功能。根据提供的文档内容,以下是一些关于jQuery插件开发的关键知识点: 1. 基本插件结构 在编写jQuery插件时,首先要了解...
总结来说,jQuery插件开发中的五种形态小结通过一系列的示例和说明,为开发者展示了如何创建一个高效、可维护的插件。这五个形态涉及到了代码的独立性、链式操作、插件的可配置性、生命周期的管理、无冲突处理以及...
jquery插件开发是提高前端开发效率的重要方式之一。在本篇文章中,我们将详细解析如何通过$.extend()方法扩展jQuery、如何通过$.fn向jQuery添加新的方法以及如何使用$.widget()方法应用jQuery UI的部件工厂方式创建...
JQuery插件的写法 最常用的jquery插件开发方式(教程合集) jquery插件的例子 jQuery插件开发教程_看这一本就行了 JQuery插件写法 jq插件最常用的写法
**jQuery图片预览插件详解** 在Web开发中,图片预览功能是用户交互体验的重要组成部分,尤其是在上传图片或展示图片集时。jQuery作为一个轻量级的JavaScript库,提供了丰富的插件来增强这一功能。本篇文章将深入...
jQuery1.3 DW插件就是这样一个例子,它让DW CS3成为一个更强大的jQuery开发平台。 在提供的文件名称“jQuery_api_for_dw4”中,虽然文件名提及的是DW4,但根据标题和描述,这个插件是为DW CS3设计的。这个文件可能...
总的来说,jQuery开发的插件极大地丰富了Web开发的工具箱,使得开发者能够高效地实现各种复杂的功能。而Kendo UI作为一款强大的jQuery库,提供了丰富的UI组件,可以快速构建现代的、响应式的用户界面。通过研究和...
基于jQuery的甘特图插件,则是将这种强大的库与甘特图的功能相结合,为开发者提供了一种在网页上展示项目计划的工具。 该开源jQuery甘特图插件的主要特点包括: 1. **美观的界面**:根据描述,这款插件设计得既...
jQuery作为一款广泛使用的JavaScript库,为开发者提供了丰富的工具和插件来实现这一目标。本文将深入探讨“jQuery统计图插件”,并介绍其特点、使用方法以及常见效果的实现。 jQuery统计图插件是基于jQuery的一款...