jq的extend()是jq插件扩展很重要的部分,到这里证明是可以自己在jq的基础上,分为两种方法去扩展或开发,为jq本身添加一个方法,可以理解成扩展静态方法和自定义方法。

今天有看到一篇帖子,对这部分的理解十分独到,特意来分享一下。

首先:$.extend({})

用这个方法给jquery本身增加一个hello的方法;

<script type="text/javascript">
$(document).ready(function (){
$.extend({
hello:function(){alert("hello world!")},
});
$("p").click(function(){
$.hello();
})
})
</script>

ps:给jquery新建了一个$.hello(),然后绑定给p元素一个点击事件,点击p元素就可以弹出对话框,hello world! 这只是一个简单的例子还可以去定义更多的静态方法给jquery。

其次:$.fn.extend({})

用这个方法给jquery对象添加一个新的方法;

<script type="text/javascript">
$(document).ready(function (){
$.fn.change = function(){
$(this).css("background","red");
};
$("p").click(function (){
$(this).change();
})
})
</script>

ps:首先用$.fn.extend({}),添加一个新的名为change()方法,然后还是给P元素绑定一个新的方法,$(this).change(),单击p元素是背景颜色会变成红色。

可以简单的对比一下,这两种方法的区别到底在哪里:

  • 第一种$.extend()方法,使用时需要带着jq的标注$.hello();而$.fn.extend()方法使用时绑定在对象上$(this).change();
  • 第一种方法是扩展一个jq方法,第二种是为jq对象扩展一个方法;
  • 可以把第一种方式看成jq的合并数组的工具函数,第二种可以是一种操作方法,类似dom操作的一些方法也可传递参数;

老生长谈的$.extend()方法的更多相关文章

  1. jQuery中的$.extend方法来扩展JSON对象及合并,方便调用对象方法

    $.extend方法可以扩展JSON对象,用一个或多个其他对象来扩展一个对象,返回被扩展的对象. 例一 合并 settings 和 options,修改并返回 settings var setting ...

  2. jQuery extend方法使用及实现

    一.jQuery extend方法介绍 jQuery的API手册中,extend方法挂载在jQuery和jQuery.fn两个不同对象上方法,但在jQuery内部代码实现的是相同的,只是功能却不太一样 ...

  3. jQuery的extend方法的深层拷贝

    一些东西长时间不用就忘了,比如这个jQuery的extend方法的深层拷贝,今天看单页应用的书的时候,看到entend第一个参数是true,都蒙了.也是,自己的大部分对jQuery的学习知识来自锋利的 ...

  4. jQuery.extend()方法和jQuery.fn.extend()方法源码分析

    这两个方法用的是相同的代码,一个用于给jQuery对象或者普通对象合并属性和方法一个是针对jQuery对象的实例,对于基本用法举几个例子: html代码如下: <!doctype html> ...

  5. (转)jQuery中的extend()方法

    本文转自:http://www.xiabingbao.com/jquery/2015/05/30/jquery-extend 原文的排版要比这里美观很多,建议去原文查看.本文仅仅作为个人的mark,方 ...

  6. 对jQuery.extend()方法的分析

    jQuery.extend方法是我们常用的方法,也是jQuery源码中的基础方法.它的主要作用是:将一个或多个“源对象”合并到一个“目标对象”中,并返回目标对象.它主要有三种表现形式: a.jQuer ...

  7. jQuery.extend方法和开发中变量的复用

    最近在用commonJS规范进行客户端开发,遇到如下问题: 一般一个模块内部可能会定义一系列变量或一系列相关变量,比如写了一个颜色选择弹框模块大概会有如下变量定义 var settings = { / ...

  8. 005 列表以及append,extend方法

    定义一个列表: number=[,'changhao','常浩',5.2] 往这个列表里面添加单一新值(类型无限制),需要使用append方法. 例如: number.append() number. ...

  9. jQuery.extend()方法和jQuery.fn.extend()方法

    jQuery.extend()方法和jQuery.fn.extend()方法源码分析 这两个方法用的是相同的代码,一个用于给jQuery对象或者普通对象合并属性和方法一个是针对jQuery对象的实例, ...

随机推荐

  1. Swift与OC区别

    一.Swift与OC区别: 1.swift程序的入口是UIApplicationMain; 2.OC的类是以.h和.m组成的;swift是一.swift结尾的; 3.OC的类是以@interface和 ...

  2. jcFeather For Arnold

    jcFeather 现在可以支持Arnold了,可以用Arnold来贴图方式渲染jcFeather的刷出的多边形羽毛. jcFeather 自带笔刷刷羽毛多边形,再配上一个Arnold shader ...

  3. Java EE 经验

    环境配置 GlassFish Error 1 Exception while loading the app : CDI deployment failure:Error loading class ...

  4. Linux或Unix环境利用符号链接升级Maven

    1,解压Maven到安装目录,在解压目录同一级创建刚解压目录的符号链接,命令如下: ln -s apache-maven-3.3.9 apache-maven 2,配置环境变量,这里Maven主目录环 ...

  5. oracle 关于null值排序

    在oracle中根据字段来desc排序的话null值可能会在数据的最前面.然而有时候我们查看数据的时候并不希望能够在前面看到这些null值的排序数据. 因此我查了一下: 1.排序的时候运用nvl(). ...

  6. pycharm 2016.3 注册码

    Choose Active Code 43B4A73YYJ-eyJsaWNlbnNlSWQiOiI0M0I0QTczWVlKIiwibGljZW5zZWVOYW1lIjoibGFuIHl1IiwiYX ...

  7. 学习 opencv---(8)非线性滤波:中值滤波,双边滤波

    正如我们上一篇文章中讲到的,线性滤波可以实现很多种不同的图像变换.然而非线性滤波,如中值滤波器和双边滤波器,有时可以达到更好的实现效果. 邻域算子的其他一些例子还有对 二值图像进行操作的形态学算子,用 ...

  8. canvas简介

    一.canvas简介 1.1 什么是canvas?(了解) 是HTML5提供的一种新标签 <canvas></canvas> 英 ['kænvəs] 美 ['kænvəs] 帆 ...

  9. Xcode LLDB 调试Tips

    1.  bt -- 显示当前线程调用堆栈 2.  e -- 执行表达式,动态修改当前线程变量的值 3.  frame variable -- 打印当前堆栈所有变量值 4.  expr -O --lan ...

  10. 八款常见的Android游戏引擎

    原文地址:http://bbs.csdn.net/topics/380203732 1.Angle  Angle是一款专为Android平台设计的,敏捷且适合快速开发的2D游戏引擎,基于OpenGL  ...