`
mj4d
  • 浏览: 302876 次
  • 性别: Icon_minigender_1
  • 来自: 杭州
社区版块
存档分类
最新评论

jQuery extend

阅读更多

开始看看jquery插件

 

$.extend和$.fn.extend区别

参考:http://www.cnblogs.com/luckboy/archive/2009/06/25/1510870.html

 

$.extend  
1、对jQuery本身扩展,比如新增方法

$.extend({
	min:function(a,b){return a >= b ? b : a}
})
console.log($.min(1,4.5))

 

 

2、合并多个对象

 有两个对象:

var obj1 = {"name":"robin", location:{"city":"chengdu","desc":"javaer"}}
var obj2 = {"last":"robin", location:{"city":"chengdu","job":"java"}}

 当$.extend(obj1, obj2)时,会将obj2有而obj1没有的属性设置到obj1上,同时会覆盖obj1中存在的属性

$.extend(obj1,obj2)  
console.log(JSON.stringify(obj1));
//{"name":"robin","location":{"city":"chengdu","job":"java"},"last":"robin"}
console.log(JSON.stringify(obj2));
//{"last":"robin","location":{"city":"chengdu","job":"java"}} 

当然也可以将合并的结果赋值到新的对象上,有两种方式,前一种obj1仍然会被修改

var nobj1 = $.extend(obj1,obj2) ;
var nobj2 = $.extend({},obj1,obj2);

前一种obj1会被修改而后面的方法则不会修改obj1

写道
jQuery.extend(target,obj1,[objN])
target: 待修改的对象。
obj1:待合并到第一个对象的对象。
objN:带合并到第一个对象的对象(可选)。

 在jQuery中,对extend方法传入的多个参数进行合并,默认将第一个参数作为target对象,会将剩下的合并在该对象上。如果第一个对象是boolean,则默认取第二个对象为target

jQuery.extend = jQuery.fn.extend = function() {
	 var options, name, src, copy, copyIsArray, clone,
		target = arguments[0] || {},
		i = 1,
		length = arguments.length,
		deep = false;

	// Handle a deep copy situation
	if ( typeof target === "boolean" ) {
		deep = target;
		target = arguments[1] || {};
		// skip the boolean and the target
		i = 2;
	}

下面来看看第一个参数如果是boolean类型。从上面的例子我们看到,在obj1和obj2中合并的都是该对象的第一级属性,对嵌套的location都是看中一个整体去替换。当然也提供了类似"深拷贝"的方式,即可以对location属性进行合并:

var nobj1 = $.extend(true, obj1,obj2);
//var nobj2 = $.extend({},obj1,obj2) ;
console.log(JSON.stringify(obj1));
//{"name":"robin","location":{"city":"chengdu","desc":"javaer","job":"java"},"last":"robin"}

 

3、对$.extend和$.fn.extend

$.extend可理解为对jQuery的静态方法扩展,在使用时不需要实例化jQuery对象。而$.fn.extend可以理解为对jQuery添加成员方法。两者的区别可以用$.trim()和$("#id").empty()来表示。

$(function() {
	$.fn.extend({
		alertThis: function(){
			$(this).click(function(){
				alert($(this).val());
			});
		}
	})

	$("#idd").alertThis();
});

 打完收工。感谢http://www.iteye.com/topic/545971

 

 

分享到:
评论

相关推荐

    jQuery.extend 函数详解

    ### jQuery.extend 函数详解 #### 一、概述 在JavaScript前端开发中,jQuery是一个非常流行的库,它简化了许多常见的操作,比如DOM操作、事件处理、AJAX交互等。`jQuery.extend`是jQuery提供的一个用于扩展jQuery...

    原生js实现jquery $.extend方法

    原生js实现jquery $.extend方法 通过遍历对象属性来实现

    jQuery extend()详解及简单实例

    jQuery extend()详解及简单实例 使用jQuery的时候会发现,jQuery中有的函数是这样使用的: $.get(); $.post(); $.getJSON(); 有些函数是这样使用的: $('div').css(); $('ul').find('li'); 有些函数是这样使用...

    jQuery.extend

    **jQuery.extend** jQuery.extend是jQuery库中的一个非常重要的方法,用于合并两个或更多的对象属性到一个目标对象中。这个功能在开发过程中非常实用,尤其是在处理配置选项、扩展插件功能或者进行对象拷贝时。本篇...

    jQuery.extend和jQuery.fn.extend的区别

    在jQuery的API中,`jQuery.extend`和`jQuery.fn.extend`是两个重要的方法,它们用于合并对象属性,但作用范围和用途有所不同。本文将深入探讨这两个方法的差异,并通过实例解析它们的工作原理。 首先,`jQuery....

    jQuery extend 的简单实例

    jQuery.extend是jQuery库中一个非常实用的功能,它主要被用来合并一个或多个对象的内容到目标对象中。该方法在处理类似对象合并、复制、扩展功能时尤为方便。接下来,我会详细阐述jQuery.extend方法的工作原理以及...

    jQuery.extend()、jQuery.fn.extend()扩展方法示例详解

    jQuery自定义了jQuery.extend()和jQuery.fn.extend()方法.其中jQuery.extend()方法能够创建全局函数或者选择器,而jQuery.fn.extend()方法能够创建jQuery对象方法. 例如: 代码如下: jQuery.extend({ showName : ...

    jQuery中extend()和fn.extend()方法详解

    jQuery中的`extend()`和`fn.extend()`方法是用于合并对象属性和方法的工具,它们在扩展和定制jQuery功能时起着关键作用。 首先,`jQuery.extend()`方法允许开发者将一个或多个对象的属性和方法合并到一个现有对象上...

    jQuery中extend函数详解

    1.$.extend({},defaults, options) 这样做的目的是为了保护包默认参数。也就是defaults里面的参数。 做法是将一个新的空对象({})做为$.extend的第一个参数,defaults和用户传递的参数对象紧随其后,这样做的好处是...

    jQuery:jQuery.extend函数详解

    ### jQuery.extend函数详解 #### 一、概述 `jQuery.extend`是jQuery库中一个非常实用且功能强大的函数,主要用于合并两个或多个对象的属性至一个新的对象中。这使得开发人员能够在编写插件或其他代码时方便地扩展...

    jQuery的extend方法【三种】

    jQuery的`extend`方法是其库中非常关键的一部分,它提供了合并对象、扩展功能和实现继承的能力。在面试中,熟悉`extend`的用法对于理解jQuery的核心机制至关重要。接下来,我们将深入探讨`extend`的三种主要用法。 ...

    详解jQuery插件开发中的extend方法

    Jquery的扩展方法extend是我们在写插件的过程中常用的方法,该方法有一些重载原型,dest是要整合的空间可以使{} 或者不写 src是一个JSON表达式表示的javascript对象…. 因此里面可以添加方法属性等等… 我么通过不同...

    jquery $.fn.extend

    `$.fn.extend`是jQuery库中的一个核心方法,主要用于扩展jQuery对象的方法集合。这个方法允许开发者自定义jQuery的函数,从而实现对DOM元素的操作或添加新的功能。在jQuery中,`$.fn`实际上是`$.prototype`的一个...

    jquery.validate.extend.js

    jquery.validate.extend.js

    jQueryExtendDemo

    《jQuery Extend 深入解析与实战应用》 在JavaScript的世界里,jQuery库以其简洁的API和强大的功能深受开发者喜爱。其中,`jQuery.extend()`是一个非常实用且关键的方法,它用于合并两个或更多的对象属性,并将结果...

    浅谈jquery.fn.extend与jquery.extend区别

    1.jquery.extend(object); 为扩展jQuery类本身.为类添加新的方法。 jquery.fn.extend(object);给jQuery对象添加方法。 $.extend({  add:function(a,b){return a+b;} }); //$.add(3,4); //return 7 jQuery添加...

Global site tag (gtag.js) - Google Analytics