$.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. Keras使用多个GPU并行

    model = Model(inputs=[v_i, v_j], outputs=output_list) model = multi_gpu_model(model,4) model.compile ...

  2. MongoDb学习(五)--Gridfs--上传下载

    版本 <dependency> <groupId>org.springframework.data</groupId> <artifactId>spri ...

  3. 聊一聊这个总下载量3603w的xss库,是如何工作的?

    上篇文章这一次,彻底理解XSS攻击讲解了XSS攻击的类型和预防方式,本篇文章我们来看这个36039K的XSS-NPM库(你没有看错就是3603W次, 36039K次,36,039,651次,数据来自h ...

  4. java使用正则的例子

    package com.accord.util; import java.util.ArrayList; import java.util.List; import java.util.regex.M ...

  5. 观《if (domain logic) then CQRS, or Saga?》所悟

    引言 Udi Dahan曾在2017年阿姆斯特丹的DDD欧洲年会上发表过一篇演讲--if (domain logic) then CQRS, or Saga.视频是UP主从Youtube搬运的,我听力 ...

  6. 【Nginx学习笔记】-初识Nginx

    Nginx 目录 Nginx Nginx 特点 Nginx 基本功能 Nginx 使用场景 Nginx 安装/卸载 Docker 方式运行 Ubuntu上安装 卸载Nginx Nginx 命令 Ngi ...

  7. mysql高并发解决方案

    mysql高并发的解决方法有: 优化SQL语句,优化数据库字段,加缓存,分区表,读写分离以及垂直拆分,解耦模块,水平切分等. 高并发大多的瓶颈在后台,在存储mysql的正常的优化方案如下: (1)代码 ...

  8. 基于Python的接口自动化-读写excel文件

    引言 使用python进行接口测试时常常需要接口用例测试数据.断言接口功能.验证接口响应状态等,如果大量的接口测试用例脚本都将接口测试用例数据写在脚本文件中,这样写出来整个接口测试用例脚本代码将看起来 ...

  9. NodeJS之npm、cnpm、npx、yarn

    一.npm 1,概念 npm 是 Node.js 官方提供的包管理工具,他已经成了 Node.js 包的标准发布平台,用于 Node.js 包的发布.传播.依赖控制.npm 提供了命令行工具,使你可以 ...

  10. 3610:20140827:161308.483 No active checks on server: host [192.168.1.10] not found

    3610:20140827:161308.483 No active checks on server: host [192.168.1.10] not found