jQuery插件类型

jQuery插件主要有3种类型:

1、封装对象方法的插件

这种插件类型是最常见的一种插件,它将对象方法封装起来,对通过选择器获取的jQuery对象进行操作。

2、封装全局函数的插件

这种插件将独立的函数加到jQuery命名空间之下。如解决冲突用的jQuery.noConflict()方法,常用的jQuery.ajax()和jQuery.trim()方法等。

3、选择器插件

虽然jQuery的选择器十分强大,但还是会需要扩充一些自己喜欢的选择器,如用color(red)来选择所有的红色字的元素

jQuery插件机制

jQuery提供了两个用于扩展jQuery功能的方法,即jQuery.fn.extend()和jQuery.extend()。前者用于扩展上文提到的第1种,后者用于扩展后两种。这两种方法都接收一个类型为Object的参数。Object对象的“键/值”对分别代表”函数或方法名/函数主体“。

另外,jQuery.extend()方法除了可以用于扩展jQuery对象以外,还可以用一个或多个其他对象来扩展一个对象,然后返回被扩展的对象。

语法:jQuery.extend(target,obj1,...[objN])

例:合并settings对象和options对象,修改并返回settings对象。

var settings={validate:false,limit:5,name:"foo"};
var options={validate:true,name:"bar"};
var newOptions=jQuery.extend(settings,options);

结果为:

newOptions={validate:true,limit:5,name:"bar"}

jQuery.extend()方法经常被用于经常用于设置插件方法的一系列默认参数,如下面代码所示:

function student(options){
options=jQuery.extend({
name:"xiaoming",
age:18,
sex:"boy" /*默认参数*/
},options); /*options为传递的参数*/
};

如果用户调用student方法的时候,在传递的参数options对象设置了相应的值,那么就使用设置的值,否则使用默认值:

student(name:"xiaohua",age:17,sex:"girl");
student(name:"xiaojun",age:16);
student();

编写jQuery插件(二)——jQuery插件类型和机制的更多相关文章

  1. layui常用插件(二) 时间插件

    日期和时间 html <div class="layui-inline"> <!-- 注意:这一层元素并不是必须的 --> <input type=& ...

  2. jQuery插件的2种类型

    1.封装方法插件  封装方法插件在本质上来说,是一个对象级别的插件,这类插件首先通过jQuery选择器获取对象,并为对象添加方法,然后,将方法进行打包,封闭成一个插件,这种类型的插件编写简单,极易调用 ...

  3. (翻译)编写属于你的jQuery插件

    Writing Your Own jQuery Plugins 原文地址:http://blog.teamtreehouse.com/writing-your-own-jquery-plugins j ...

  4. jQuery第七章插件的编写和使用

    1.本章目标 编写jquery插件 2.插件 也称为扩展,是一种按照一定的规范的应用程序接口编写出来的程序 插件的目标是给已有的一系列函数做一个封装,以便在其他的地方复用,方便维护和开发效率 3.jq ...

  5. 编写jQuery插件(一)——插件约定及插件中的闭包

    编写插件的目的是给已经有的一系列方法或函数做一个封装,以便在其他地方重复使用,提高开发效率和方便后期维护. 在编写jQuery插件的时候,我们一般会遵循一些约定: jQuery插件推荐命名为:jque ...

  6. jQuery用面向对象的思想来编写验证表单的插件

    本人的重点是怎么构建一个简单有效可扩展的jQuery表单验证插件,这篇文章没有教你怎么用 validate plugin.我们的重点在学习一些jQuery,Javascript面向对象编程的知识. 下 ...

  7. 生成二维码的 jQuery 插件:jquery.qrcode.js的中文乱码问题

    在使用jquery.qrcode.js这个插件生成二维码的时候发现并不能识别中文. 原因在于:jquery-qrcode是采用charCodeAt()方式进行编码转 换的. 而这个方法默认会获取它的U ...

  8. jQuery打造智能提示插件二(可编辑下拉框)

    在上一篇 jQuery打造智能提示插件 上改进,增加下拉按钮,修复点击下拉区域外不隐藏BUG 效果 下拉按钮素材: js封装,注意红色部分为BUG修复,然后传入boxwidth不带px: /* /// ...

  9. jQuery extend() & jQuery.fn.extend(),插件编写

    资料来源:网上资料整理并自行改编测试.复制以下代码并依赖jquery.js,jquery.validate.js即可执行.有误之处,请@我啊,敬请赐教. <!DOCTYPE html PUBLI ...

随机推荐

  1. greasemonkey修改网页内指定函数

    greasemonkey replace function? 方法1:编写GM代码 alert("hello2"); var mydiv =document.getElementB ...

  2. 【转】Ubuntu12.04 LTS下环境变量设置

    原文网址:http://blog.chinaunix.net/uid-26963688-id-3221439.html 1.设置当前用户环境变量(对root用户无效) 打开终端输入:light@cha ...

  3. 【转】每天一个linux命令(36):diff 命令

    原文网址:http://www.cnblogs.com/peida/archive/2012/12/12/2814048.html diff 命令是 linux上非常重要的工具,用于比较文件的内容,特 ...

  4. vue-cli 打包报错:Unexpected token: punc (()

    vue-cli 打包报错: ERROR in static/js/vendor.ed7d2353f79d28a69f3d.js from UglifyJs Unexpected token: punc ...

  5. Arrays、ArrayUtils 区别

    Arrays java.util 包提供的静态类:java.util.Arrays 此静态类专门用来操作array ,提供搜索.排序.复制等静态方法. ArrayUtils apache 提供的类:o ...

  6. mysql复制表结构create table as和like的区别

    对于MySQL的复制相同表结构方法,有create table as 和create table like 两种,区别是什么呢? create table t2 as select * from t1 ...

  7. centOS 6.5关闭防火墙步骤

    centOS 6.5关闭防火墙步骤 关闭命令:  service iptables stop         永久关闭防火墙:chkconfig iptables off 两个命令同时运行,运行完成后 ...

  8. Qt5布局管理(一)——QSplitter分割窗口类

    转载:LeeHDsniper 概述 本文首先通过三个实例分别介绍Qt5的分割窗口QSplitter类.停靠窗口QDockWidget类.堆栈窗体QStackedWidget类,然后介绍布局管理器的使用 ...

  9. 正则捕获的细节及replace分析

    1.var reg=/./与var reg=/\./的区别? 前者代表任意一个字符, 后者代表这个字符串中得有一个点 2.?的使用 如果单独的一个字符后面带? 代表1个或0个这个字符的出现: 列如: ...

  10. MongoDB CPU 利用率高,分析慢请求

    Jemeter 压测过程,发现mongodb的CPU均达到100%,需要查看mongodb的执行情况,使用mongo自带的profiling功能. profiling将请求的执行情况记录在DB下的 s ...