一.前言
在jQuery中，有许多已定义的方法可以直接使用，如：
用于替换标签的：原创 jQuery中的replaceWith和replaceAll方法；
用于删除标签的： jQuery中empty和remove方法；
用于绑定事件的一系列方法： jQuery事件的绑定
用于包裹标签的： jQuery中wrap、wrapAll、wrapInner、unwrap方法
用于插入HTML元素的： jQuery中after和insertAfter方法、 jQuery中append与appendTo方法
使用示例见以上的文章。
那么当我们想要使用一个jQuery中未定义的功能时，就可以用扩展机制将此功能创建成一个新的方法，然后就可以像调用jQuery直接定义的方法一样去调用他们了。
扩展的方法有以下两种：
二.jQuery.extend(object)
该方法是扩展jQuery对象本身，主要是用来扩展jQuery全局函数 ，被它扩展出来的方法的特点是调用时直接$.函数名(参数)即可，下面讲解如何使用这个方法。
前情：在jQuery中并没有比较两个数大小的方法，所以当我们想要实现这个功能时，便可以扩展出一个jQuery全局函数，在如下代码中：
第10行：直接用jQuery调用extend方法，该方法的参数列表中传入的参数是一个由花括号包裹的初始化式创建的JavaScript对象。
第11、14行：在该对象的创建时定义两个函数：min(a,b)和max(a,b)，作用分别是比较传入的a和b的大小（初始化式创建JavaScript对象的方式见博客： JavaScript创建对象的方式），这时min和max就已经是两个可以直接调用的方法了。
第19、20行：用$直接调用max和min，传入参数就可以比较两个数的大小了，运行结果如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>show([s,[e],[fn]])/hide([s,[e],[fn]]) </title>
<script src="js/jquery-3.3.1.js"></script>
</head>
<body>
<script>
jQuery.extend({
min:function(a,b){
return a>b?b:a;
},
max:function(a,b){
return a<b?b:a;
}
});
console.log($.min(1,2));
console.log($.max(1,2));
</script>
</body>
</html>
三.jQuery.fn.extend(object)
使用该方法扩展的是 jQuery 元素集，主要用于扩展jQuery插件，通俗地讲就是调用时需要先创建jQuery对象，然后才能用jQuery对象调用相应的函数，下面讲解如何使用。
前情：在jQuery中，并没有一个方法可以获取form表单中复选框里被选中的元素的值，这时我们可以扩展一个方法来实现这个功能，因为此时要获取的对象应该被指定，所以应该使用jQuery.fn.extend(object)来进行扩展，代码如下：
第19行：使用jQuery调用fn，fn也就是function的缩写，再调用extend方法，然后在参数列表中输入一个匿名对象，该对象中包含着你要实现的功能的函数values()。
第22行：这里使用this关键字，由于是获取复选框中被选中的项，所以到时候一定会是type类型为checkbox的input标签来调用这个方法，所以在此例中this指代的就是name为hobby的四个input标签的dom对象所组成的数组。所以这时我们便使用each()方法对该数组进行遍历，参数列表中的遍历函数是一个匿名函数。
第23行：在该匿名函数中，进行的操作就是判断数组中的每一个复选框是否被选中，我们可以看到这里又出现了一个this，但这里的this和上一行的不同，因为它所处的位置是each方法的参数列表中，所以这个this指代的是被遍历的数组中的当前元素的dom对象。在这调用checked属性便可返回该复选框是否被选中。
第24行：如果判断出该复选框被选中了，则将该对象的value值拼接到字符串result上。
第27行：由于此时的result字符串是以‘，’开头的，所以此处用该字符串调用substring()方法从该字符串的第二个字符开始截取，获取到的就是我们要输出的形式了。
第29行：由于此时复选框中可能一个被选中的都没有，所以result字符串可能为空，所以在此处return的时候用三目运算符进行一个判断。
方法扩展好了，接下来就是调用：
第33、34行：这里定义一个调用函数，在函数中先使用属性选择器获取name值为hobby的input标签，然后再将该jQuery对象调用扩展方法values()得到的返回值打印在控制台上。
第15行：最后将调用函数添加到表单提交的onclick标签中。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>show([s,[e],[fn]])/hide([s,[e],[fn]]) </title>
<script src="js/jquery-3.3.1.js"></script>
</head>
<body>
<form>
<input type="checkbox" name="hobby" value="1"/>篮球
<input type="checkbox" name="hobby" value="2"/>足球
<input type="checkbox" name="hobby" value="3"/>乒乓球
<input type="checkbox" name="hobby" value="4"/>橄榄球
<input type="button" value="选中项的值" οnclick="t()"/>
</form>
<script>
jQuery.fn.extend({
values:function(){
var result = "";
this.each(function(){
if(this.checked){
result = result+","+this.value;
}
})
result = result.substring(1);
return result==""?"":result;
}
})
function t(){
console.log($("[name='hobby']").values());
}
</script>
</body>
</html>运行结果如下：
