jQuery.fn.extend()
jQuery.fn.extend()
extend()方法是定义在jQuery构造函数的prototype对象上面的一个方法,这样做就能使得所有jQuery对象的实例都能共享这个方法。jQuery构造函数的prototype对象可以被简写成jQuery.fn对象。jQuery.fn.extend()方法继承了jQuery原型($.fn)对象。
实例:添加两个方法到jQuery原型($.fn),并且使用他们。
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery.fn.extend demo</title>
<style>
label { display: block; margin: .5em; }
</style>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
</head>
<body>
<label><input type="checkbox" name="foo"> Foo</label>
<label><input type="checkbox" name="bar"> Bar</label>
<script>
//第一种写法:
jQuery.fn.extend({
check: function() {
//对 jQuery 对象进行迭代,为每个匹配元素执行函数,实现选中复选框功能。
return this.each(function() { this.checked = true; });
},
uncheck: function() {
return this.each(function() { this.checked = false; });
}
});
//使用新创建的.check()方法
$( "input[type='checkbox']" ).check();
</script>
</body>
</html>
jQuery.fn.extend()与jQuery extend()对比
jQuery.extend()是对jQuery对象的扩展,可以理解为静态方法,是全局的,不需要实例jQuery就可以使用。
jQuery.fn.extend()是jQuery实例对象的方法,可以理解为普通方法。定义插件时需要返回this,以支持jQuery的链式操作。该方法可以被所有实例共享,所以jQuery实例对象才可以使用。
参考: