jQuery自定义方法与扩展-优快云博客

<!DOCTYPE html>
<html 
lang="en">
<head>
<meta 
charset="UTF-8">
<meta 
name="viewport" 
content="width=device-width, initial-scale=1.0">
<meta 
http-equiv="X-UA-Compatible" 
content="ie=edge">
<title>Document</title>
<script
src="jquery-1.11.1.min.js"></script>
</head>
<body>
<div 
id="myDiv">This is a Params JQuery!</div>
<script>
/* 
方法列表： 
1、jQquery.extend(Object); 是对jQuery类的自定义扩展
2、jQuery.fn.exten(Object)；是对jQuery对象的自定义扩展*/


jQuery.fn.test =
function(){
alert('这是jquery对象方法!');
}

jQuery('div').click(function(){
$(this).test()
})

jQuery.fn.extend({
test:function(){
return this.each(function(){
alert(this.nodeName)
});
}
});
jQuery('body *').click(function(){
$(this).test()
})

/*优选*/
(function($){
$.fn.hilight=function(options){
var defaults={
foreground:'red',
background:'yellow'
};
var opts =
$.extend(defaults,options);
$(this).css('background-color',opts.background);
$(this).css('color',opts.foreground);
};
})(jQuery)
$('#myDiv').hilight({foreground:'blue',background:'red'})
</script>
</body>
</html>