提供了编程的基础技术教程

zl程序教程

您现在的位置是：首页 >  前端

当前栏目

jQuery.extend和jQuery.fn.extend的区别

jQuery 区别 extend fn
2023-09-27 14:20:23 时间

1、简单来说，jQuery.extend是给jQuery或$这个类用的；jQuery.fn.extend是给jQuery的对象(如：$('div'))用的。

2、创建一个html页面，里面代码为：

<html>
<head>
<script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
</head>
<body>
<div>jQuery.extend和jQuery.fn.extend的区别</div>
</body>
</html>

3、用jQuery.extend写的扩展

$.extend({
　　test:function(){
　　　　console.log('$.extend function');
　　},
　　attr:'$.extend attr'
});

$.test();//$.extend function

$.attr;//$.extend attr

4、用jQuery.fn.extend写的扩展

$.fn.extend({
　　fnTest:function(){
　　　　console.log(this.html());
　　},
　　fnAttr:'$.fn.extend fnAttr'
});

如果直接使用$.fnTest();会报错，$.fnAttr;会报undefined

使用jQuery对象调用其方法和属性：

$('div').fnTest();//jQuery.extend和jQuery.fn.extend的区别

$('div').fnAttr;//$.fn.extend fnAttr

相关文章