$.extend

1、扩展jQuery静态方法.

$.extend({
  myFun:function(){alert('test函数')}
  min: function(a, b) { return a < b ? a : b; },
  max: function(a, b) { return a > b ? a : b; }
}); $.myFun();
$.min(2,3); // 2
$.max(4,5); // 5

2、合并多个对象.

var newcss = jquery.extend(css1,css2)  //newcss就是合并的新对象。
var newcss = jquery.extend({},css1,css2) //newcss就是合并的新对象.而且没有破坏css1的结构。 //用法: jQuery.extend(obj1,obj2,obj3, ..)
var Css1={size: "10px",style: "oblique"}
var Css2={size: "12px",style: "oblique",weight: "bolder"}
$.jQuery.extend(Css1,Css2)
//结果: Css1 = {size: "12px",style: "oblique",weight: "bolder"}

3、深度镶套对象

新的extend()允许你更深度的合并镶套对象

// 以前的 .extend()
jQuery.extend(
  { name: “John”, location: { city: “Boston” } }, { last: “Resig”, location: { state: “MA” } }
);
//结果:{ name: “John”, last: “Resig”, location: { state: “MA” } }

// 新的更深入的 .extend()
jQuery.extend(
  true,
  { name: “John”, location: { city: “Boston”, country:”USA”} },
  { last: “Smith”, location: { state: “MA”, country:”china”} }
);
//结果 { name:“John”, last:“Smith”, location:{city:“Boston”, state:“MA”, country:”china” }}

$.fn.extend(object);

$.fn是指jQuery的命名空间,fn上的成员(方法function及属性property),会对jQuery实例每一个有效。

jQuery.fn = jQuery.prototype = {

init: function( selector, context ) {//.... 

};

原来 jQuery.fn = jQuery.prototype.

所以,它是对jQuery.prototype进一步得扩展,就是为jQuery类添加“成员函数”。jQuery类的实例可以使用这个“成员函数”。

比如要开发一个插件,做一个特殊的编辑框,当它被点击时,便alert当前编辑框里的内容

$.fn.extend({
doAlertWhileClick:function() {
$(this).click(function(){
 alert($(this).val());
});
}
});
$("#input1").doAlertWhileClick(); // 页面上为: //$("#input1") 为一个jQuery实例,当它调用成员方法 doAlertWhileClick后,便实现了扩展,每次被点击时它会先弹出目前编辑里的内容。

区别:

1、两者调用方式不同:

jQuery.extend()一般由传入的全局函数来调用,主要用来拓展全局函数,如$.init()、$.ajax();

jQuery.fn.extend()一般由具体的实例对象来调用,可用来拓展个选择器,例如$.fn.each();

2、两者的主要功能作用不同:

jQuery.extend(object); 为扩展jQuery类本身,为自身添加新的方法。jQuery.fn.extend(object);给jQuery对象添加方法

3、大部分插件都是用jQuery.fn.extend()

 

随机推荐

  1. Reset 对象属性

    Input Reset 对象 在 HTML 表单中 标签每出现一次,一个 Reset 对象就会被创建. 当重置按钮被点击,包含它的表单中所有输入元素的值都重置为它们的默认值.默认值由 HTML val ...

  2. SpringBoot 2.X以上集成redis

    在网上看到的教程和资料大多数都是2.X以下的版本.使用起来会出现各种问题,通过百度,最后终于弄好了. 2.x以上使用的是 spring-boot-starter-data-redis 2.x一下使用的 ...

  3. 无延时去斗按键实现方法(不好CPU)

    这一灵感来源于定时器计数的方法,最后可以实现的效果跟咱们电脑键盘按键的效果一样!我先来介绍下基本原理吧! 采用定时器中断的方法,比如定时器终端我们设置为5ms,我们需要按键按下超过40ms时才算有按键 ...

  4. Vue.js有赞商城(思路以及总结整理)

    以下是本次项目的代码链接和预览链接:    代码链接:https://github.com/Leonardo-zyh/Vue-youzanStore    预览链接:https://leonardo- ...

  5. 简单4步,利用Prometheus Operator实现自定义指标监控

    本文来自Rancher Labs 在过去的文章中,我们花了相当大的篇幅来聊关于监控的话题.这是因为当你正在管理Kubernetes集群时,一切都会以极快的速度发生变化.因此有一个工具来监控集群的健康状 ...

  6. Java ClassLoader浅析

    双亲委派 提起 java 类加载器,自然绕不开其双亲委派模型 什么是双亲委派 提起双亲委派,首先想到便是那张经典的向上委派图 一般场景下,当某个类将要被加载时,由系统上下文默认的类加载器Thread. ...

  7. GitHub基础使用指南

    引言: 只要进行了一段时间的软件或者编程相关知识的学习,相信大家或多或少都会见过这只"猫猫",这可不是什么宠物店铺的商标,身为即将成为程序猿/媛的你,或者已经是一位程序猿/媛的你, ...

  8. Python 日志打印之logging.config.dictConfig使用总结

    日志打印之logging.config.dictConfig使用总结 By:授客 QQ:1033553122 #实践环境 WIN 10 Python 3.6.5 #函数说明 logging.confi ...

  9. 【JavaWeb】AJAX 请求

    AJAX 请求 什么是 AJAX AJAX(Asynchronous JavaScript And XMl),即异步 JS 和 XML.是指一种创建交互式网页应用的网页开发技术. AJAX 是一种浏览 ...

  10. 1018 Public Bike Management (30分) PAT甲级真题 dijkstra + dfs

    前言: 本题是我在浏览了柳神的代码后,记下的一次半转载式笔记,不经感叹柳神的强大orz,这里给出柳神的题解地址:https://blog.csdn.net/liuchuo/article/detail ...