jQuery为开发插件提拱了两个方法,分别是:
jQuery.fn.extend(object);
jQuery.extend(object);
jQuery.extend(object); 为扩展jQuery类本身.为类添加新的方法。
jQuery.fn.extend(object);给jQuery对象添加方法。
fn 是什么东西呢。查看jQuery代码,就不难发现。
jQuery.fn = jQuery.prototype = {
init: function( selector, context ) {//....
//......
};
原来 jQuery.fn = jQuery.prototype.对prototype肯定不会陌生啦。
虽然 javascript 没有明确的类的概念,但是用类来理解它,会更方便。
jQuery便是一个封装得非常好的类,比如我们用 语句 $("#btn1") 会生成一个 jQuery类的实例。
jQuery.extend(object); 为jQuery类添加添加类方法,可以理解为添加静态方法。如:
$.extend({
add:function(a,b){return a+b;}
});
便为 jQuery 添加一个为 add 的 “静态方法”,之后便可以在引入 jQuery 的地方,使用这个方法了,
$.add(3,4); //return 7
jQuery.fn.extend(object); 对jQuery.prototype进得扩展,就是为jQuery类添加“成员函数”。jQuery类的实例可以使用这个“成员函数”。
比如我们要开发一个插件,做一个特殊的编辑框,当它被点击时,便alert 当前编辑框里的内容。可以这么做:
Java代码
$.fn.extend({
alertWhileClick:function(){
$(this).click(function(){
alert($(this).val());
});
}
});
$("#input1").alertWhileClick(); //页面上为:<input id="input1" type="text"/>
$("#input1") 为一个jQuery实例,当它调用成员方法 alertWhileClick后,便实现了扩展,每次被点击时它会先弹出目前编辑里的内容。
真实的开发过程中,当然不会做这么小白的插件,事实上jQuery提拱了丰富的操作文档,事件,CSS ,Ajax、效果的方法,结合这些方法,便可以开发出更加 Niubility 的插件。
分享到:
相关推荐
$.fn是指jquery的命名空间,加上fn上的方法及属性,会对jquery实例每一个有效。 如扩展$.fn.abc(),即$.fn.abc()是对jquery扩展了一个abc方法,... fn是什么东西呢。查看jQuery代码,就不难发现。 代码如下: jQuery.fn =
jQuery为开发插件提拱了两个方法,分别是: JavaScript代码 代码如下: jQuery.fn.extend(object); jQuery.extend(object); jQuery.extend(object); 为扩展jQuery类本身.为类添加新的方法。 jQuery.fn.extend(object)...
jQuery为开发插件提拱了两个方法,分别是: 代码如下: jQuery.fn.extend(object); jQuery.extend(object); jQuery.extend(object); 为扩展jQuery类本身.为类添加新的方法。 jQuery.fn.extend(object);给jQuery对象...
jQuery为开发插件提拱了两个方法,分别是: jQuery.fn.extend(object); jQuery.extend(object); jQuery.extend(object); 为扩展jQuery类本身.为类添加新的方法。 jQuery.fn.extend(object);给jQuery对象添加方法。 ...
jQuery为开发插件提拱了两个方法,分别是: jQuery.fn.extend(object); jQuery.extend(object); jQuery.extend(object); 为扩展jQuery类本身.为类添加新的方法。 jQuery.fn.extend(object);给jQuery对象添加方法。 ...
首先,我们要明白`jQuery.fn`和`jQuery.prototype`实际上是同一个东西,它们都是jQuery对象实例的方法集合。当我们向`jQuery.fn`或`jQuery.prototype`添加新的方法时,实际上是在扩展jQuery对象的原型,使得所有...
通过`$.fn.extend()`,开发者可以轻松创建自定义方法,构建个性化的jQuery插件。 9. **兼容性处理**:jQuery致力于提供跨浏览器的解决方案,通过封装差异,使得开发者不必关心不同浏览器之间的兼容性问题。 10. **...
jQuery 是一个广泛使用的JavaScript库,它极大地简化了JavaScript的DOM操作、事件处理、动画设计以及Ajax交互。在本文中,我们将深入探讨jQuery的核心概念、主要功能及其在实际开发中的应用。 1. **jQuery核心概念*...
在本文中,我们将深入探讨50个经典的jQuery案例,这些案例展示了jQuery的强大功能和灵活性,帮助开发者提高效率并创建出令人惊艳的用户界面。** 1. **选择器与遍历DOM** - `$("#id")`:通过ID选择元素。 - `$("....
首先我解释一下jQuery jQuery有一个用来作为DOM快速载入javascript的得心应手的小函数,那就是ready… 他在页面加载完成之前执行。 为什么不用[removed](),因为[removed]函数执行的时候,要说明所有东西已经载入,...
如果对jQuery这东西只停留在用的层面,而不知其具体实现的话,真的很容易用出问题来。这也是为什么近期我一直不怎么推崇用jQuery,这框架的API设定就有误导人们走上歧途之嫌。 代码如下: $.fn.beautifyTable = ...
最近在学习JS的OOP所以写了这么个东西 使用方法: $(“.viewArea img”).zoom({height:74,width:103}); 效果演示: http://demo.jb51.net/html/jquery_img/jquery_img.htm代码: 代码如下: (function($){ $.fn.zoom ...
选择了表格中的第一个tr(即表头)中的th元素,并在每一个th元素中插入了一个div,这个div带有自定义的CSS样式类resizeDivClass,使得鼠标可以识别为可拖拽状态,即当鼠标悬停在该div上时,光标变为e-resize(东西向...