jquery扩展方法
jquery插件的开发包括两种:一种是类级别的插件开发,即给jquery添加新的全局函数,相当于给jquery类本身添加方法。
jquery的全局函数就是属于jquery命名空间的函数,另一种是对象级别的插件开发,即给jQuery对象添加方法。
也可以理解为另外两种方式,一种是jQuery本身的扩展方法,另一种是jQuery所选对象的扩展方法。
1.jQuery.extend(Object); // jQuery 本身的扩展方法
2.jQuery.fn.extent(Object); // jQuery 所选对象扩展方法
下面就两种函数的开发做详细的说明。
1、类级别的插件开发
类级别的插件开发最直接的理解就是给jQuery类添加类方法,
可以理解为添加静态方法。典型的例子就是$.AJAX()这个函数,将函数定义于jQuery的命名空间中。
关于类级别的插件开发可以采用如下几种形式进行扩展:
1.1 添加一个新的全局函数
$.foo = function(){
alert("foo");
}
//调用方法
$.foo();
1.2 使用jQuery.extend(object);
$.extend({
foo:function(){
alert("foo");
},
bar:function(){
alert("bar");
}
})
//调用方法
$.foo();
$.bar();
1.3 使用命名空间
$.myPlugin = {
foo:function(){
alert("foo");
},
bar:function(){
alert("bar");
}
}
//调用方法
$.myPlugin.foo();
$.myPlugin.bar();
2、对象级别的插件开发
$.fn.foo = function(){
alert("hello jquery");
}
$('#myF').foo()
(function($){
$.fn.extend({
pluginName:function(opt,callback){
alert("foo");
}
})
})(jQuery);
$("#myF").pluginName();
(function (jq) {
jq.fn.foo = function (obj) {
alert(obj);
};
})(jQuery)
$("#myF").foo("hello jquery");
jquery扩展方法的更多相关文章
- jquery扩展方法(表单数据格式化为json对象)
1.jquery扩展方法(表单数据格式化为json对象) <script type="text/javascript"> // 将表单数据序列化为一个json对象,例如 ...
- 使用jquery获取url及url参数的方法及定义JQuery扩展方法
1.jquery获取url很简单,代码如下: window.location.href; 其实只是用到了javascript的基础的window对象,并没有用jquery的知识. 2.jquery获取 ...
- Jquery 扩展方法
$.fn是指jquery的命名空间,加上fn上的方法及属性,会对jquery实例每一个有效. 如扩展$.fn.abc() 那么你可以这样子:$("#div").abc(); 通常使 ...
- jQuery扩展方法笔记
一.方式列表: 1.jQuery.extend(Object); // jQuery 本身的扩展方法 2.jQuery.fn.extend(Object); // jQuery 所选对象扩展方法 二. ...
- Jquery 扩展方法实现原理
JSONP原理 首先:JSON和JSONP是不一样的概念. JSON是一种数据交换格式,而JSONP是非正式传输协议. 该协议的一个要点就是允许用户传递一个callback参数给服务端,然后服务端返回 ...
- jquery源码解析:jQuery扩展方法extend的详解
jQuery中要扩展方法或者属性都是通过extend方法实现的.所谓的jQuery插件也是通过extend方法实现的. jQuery.extend扩展的是工具方法,也就是静态方法.jQuery.fn. ...
- jquery扩展方法案例
-----------------扩展方法: $.extend({ "max": function (a, b) { if (a > b) return a; }, &quo ...
- jQuery扩展方法 (插件机制)
jQuery.extend(object) 扩展jQuery对象本身. 用来在jQuery命名空间上增加新函数. 在jQuery命名空间上增加两个函数: <script> jQuery.e ...
- js jquery 扩展方法
//扩展Array,增加IsInAyyay函数.函数功能:判断数组是否包含某元素 Array.prototype.IsInAyyay=function(e) { for (var i=0;i<t ...
随机推荐
- 每日算法37:Rotate Image (图像旋转)
You are given an n x n 2D matrix representing an image. Rotate the image by 90 degrees (clockwise). ...
- 【百度地图API】如何利用PhoneGap制作地图APP
原文:[百度地图API]如何利用PhoneGap制作地图APP 摘要:百度地图API是一套由javascript编写的地图程序接口,按说它应该运行在浏览器上.现在,只要利用PhoneGap,我们就能开 ...
- iOS8自适应布局视频教程
联系:http://www.elsyy.com/course/6480 这是颐和园最近录制iOS8视频课程.简介iOS8出现在自适应布局. 本教程的书,颐和园<ios8 swift编程指南> ...
- C++中避免内存泄露常见的解决方式
常见内存泄露及解决方式-选自ood启发录 new/delete, array new/arrray delete匹配 case 1: 在类的构造函数与析构函数中没有匹配地调用 new/delete! ...
- Linux基础正则表达式:grep,sed
先说明语系对正则表达式的影响 LANG=C:0,1,2,3,4...A,B,C,D...Z a b c d ... z LANG=zh_CN:0,1,2,3,4...a A b B c C ...
- js 里面 写 C# 代码 遇到的问题
js 代码块 必须放置在 body 里面
- VS2012 update1 和 VS2012 Lang Pack 离线安装方法
原文:VS2012 update1 和 VS2012 Lang Pack 离线安装方法 最近有需要用VS2012打开ReactOS这个大项目,生成sln后打开用来导航代码什么的,但其代码都是ascii ...
- linux简单的数据包捕获分析
有时我们会遇到一些问题,需要捕捉数据包分析,当手头有没有专业的抓图工具,您可以使用tcpdump相反,看看(一般版本附带这个工具) 比如,我们要分析eth0与接口192.168.7.188 这个对象I ...
- Java 之Integer相等比较
1.问题提出 今天在和同事讨论问题的时候,无意间谈到了Integer对象的比较,先看下代码: package test; public class IntegerEqual { /** * @para ...
- Office 365 – Exchange Online examples
原文 Office 365 – Exchange Online examples 2012 is upon us and here’s wishing you all a very happy and ...