<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript" src="js/jquery-3.1.0.js">
</script>
<script type="text/javascript">
$.fn用来给jQuery添加对象插件（对象方法）
$.fn.方法名 = 方法函数
给jQuery添加一个新插件，传入颜色关键字，让标签字体变色
$.fn.setColor = function(color) {
this 指代的是当前调用者，也就是方法操作的jQuery对象
当插件内部调用了jQuery方法实现功能时，可以直接把操作函数返回出去，因为jQuery中的方法执行完毕后会返回这个操作对象，也就间接的把当前操作的对象返回出去。如果没有使用jQuery来实现功能，则需要手动把this指针返回出来
我们把操作对象返回出去的目的是为了让自定义的插件能够像jQuery方法那样支持链式语法
return this.css('color', color);
return this;
}
取出a标签中的href属性的值，然后显示在a标签中
.each(function):遍历调用者的数据，把调用者里的数据执行function指定的操作
$.fn.readHref = function (){
this.each(function(){
this：在遍历中，可以使用this来指代遍历到的元素，而遍历到的元素是DOM节点，并不是jquery的对象，所以不能直接在this后使用jq方法
下面这两种方式等同
var str = ':' + $(this).attr('href');
$(this).append(str);
$(this).append(':' + $(this).attr('href'));
})
return的this指针指向的是选择器选中的所有a标签。
如果在遍历的过程中返回this，也可以返回a标签对象，但并不是所有选中的a标签集合对象，而是当前遍历的a标签对象
return this;
}
$(function(){
// 调用插件让标签字体颜色变红
$('a').setColor('red').css('fontSize','24px');
$('p').setColor('green');
$('a').readHref();
})
</script>
</head>
<body>
<a href="http://www.wodebike.com">我的博客</a>
<br />
<a href="http://www.weibo.com">我的微博</a>
<br />
<p>哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈啊哈哈哈哈哈哈</p>
</body>
</html>
