jQuery插件开发1
jQuery为开发插件提拱了两个方法,分别是:
JavaScript代码
jQuery.fn.extend(object);
jQuery.extend(object);
jQuery.extend(object); 为扩展jQuery类本身.为类添加新的方法。
jQuery.fn.extend(object);给jQuery对象添加方法。
<script type="text/javascript">
<%--
$(function()
{
//给jQuery增加类方法(相当于静态方法)
jQuery.test = function()
{
alert("我是MM");
}
$("#b1").click(function()
{
//通过类来调用test()
$.test();
/*通过实例不能调用test()方法
$("#b1").test();
*/
});
});
--%>
//如果想通过实例来调用test()方法
/*
$(function()
{
//给jQuery.fn增加类方法,fn相当于prototype(相当于原型扩展,会影响每一个实例) jQuery.fn = jQuery.prototype
jQuery.fn.test = function()
{
alert("我是MM");
}
$("#b1").click(function()
{
$("#b1").test();
});
});
*/
/***
$(function()
{
//来扩展jQuery类,这相当于类方法,
//extend一个参数相当于扩展核心对象,两个参数相当于合并
jQuery.extend({
"test" : function()
{
alert("我是MM");
}
});
$("#b1").click(function()
{
//通过类来调用test()
$.test();
});
});
**/
$(function()
{
//来扩展jQuery类,,添加fn相当jQuery实例
jQuery.fn.extend({
"test" : function()
{
alert("我是MM");
}
});
$("#b1").click(function()
{
//通过类的实例来调用test()
$("#b1").test();
});
});
</script>
</head>
<body>
<input type="button" id="b1" value="点击"/>
</body>
<script type="text/javascript">
<%--
$(function()
{
jQuery.jsTest =
{
"test":function()
{
alert("我的插件01");
}
};
$("#b1").click(function()
{
$.jsTest.test();
});
});
--%>
/***
$(function()
{
jQuery.fn.jsTest =
{
"test":function()
{
alert("我的插件02");
}
};
$("#b1").click(function()
{
$("#b1").jsTest.test();
});
});
**/
$(function()
{
jQuery.fn.extend
(
{jsTest :
{
"test":function()
{
alert("我的插件03");
}
}
}
);
$("#b1").click(function()
{
$("#b1").jsTest.test();
});
});
</script>
</head>
<body>
<input type="button" id="b1" value="点击"/>
</body>