首页 > Web开发 > 详细

jquery中的$.fn的用法

时间:2019-04-22 13:09:15      阅读:128      评论:0      收藏:0      [点我收藏+]

一、$.fn.method()=function(){}和$.fn.extend({})的比较

jQuery.fn === jQuery.prototype

1.$.fn.method()=function(){}的调用把方法扩展到了对象的prototype上,所以实例化一个jQuery对象的时候,它就具有了这些方法。

比如:

$.fn.myExtension = function(){
 var currentjQueryObject = this;
 //work with currentObject
 return this;//you can include this if you would like to support chaining
};
技术分享图片
$.fn.blueBorder = function(){
 this.each(function(){
  $(this).css("border","solid blue 2px");
 });
 return this;
};
$.fn.blueText = function(){
 this.each(function(){
  $(this).css("color","blue");
 });
 return this;
};
技术分享图片

由于有return this,所以支持链式,在调用的时候可以这样写:$(‘.blue‘).blueBorder().blueText();

2.$.fn.extend({}) 是对$.fn.method()=function(){}的扩展,它可以定义多个方法:

$.fn.extend({
    a: function() { },
    b: function() { }
});

等效于:

$.fn.a = function() { };
$.fn.b = function() { };

二、$.extend({})  ,为jQuery类添加方法,可以理解为扩展静态方法

 

$.extend({
    abc: function(){
        alert(‘abc‘);
    }
});

 

usage: $.abc(). (No selector required like $.ajax().)

jquery中的$.fn的用法

原文:https://www.cnblogs.com/wangchaonan/p/10749305.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!