$.extent()的理解
$.extend()主要是用来扩展插件的,所谓的插件就是封装好的函数或者方法,可以直接调用。
$.extend()与$.fn.extend()(或者写成$.prototype.extend()或者jquery.prototype.extend())这两个好像,但又不一样,主要区别在哪里呢,区别在于前者是对jQuery类的一个封装,可以把jQuery看成一个类;而后者是经过实例化进行调用实例化的函数。
举个例子:
写个简单的求最大值或者最小值的插件:
首先看$.extend(),
$.extend({
max:function(a,b){
return a>b?a:b;
},{
min:function(a,b){
return a<b?b:a;
})
这里就可以直接调用:$.max(2,3)//3
再看$.fn.extend():
$.fn.extend({
alertWhileClick: function() {
$(this).click(function() {
alert($(this).val());
});
}
});
//$("#input1")是jQuery的实例,调用这个扩展方法
$("#input1").alertWhileClick();
另外,$.extend(obj1,obj2)这种写法是将obj2中与obj1中相一样的属性进行覆盖,并且添加obj1中没有的属性,如果obj1中有某个属性而obj2中没有,那么最后在替换后的obj1中也会保持存在,extend这个单词就是扩展的意思,也就是obj2里的是用来更新obj1的内容的。
举个综合例子:
<div value='100' id="content" style="width: 100px;height: 100px;border: 1px solid green;" ></div>
<script type="text/javascript">
(function($){
$.fn.extend({//这里加个大括号说明这里是个对象,那用jq实例化之后直接像调用object一样去调用函数就可以了。
'setColor':function(option){
var defult={
background:'green'
}
$.extend(true, defult, option);
$(this).css('background',defult.background);
}
})
$('#content').setColor()//默认绿色
$('#content').setColor({background:'red'})//红色
})
</script>
参考:http://www.cnblogs.com/yuqingfamily/p/5775950.html
随机推荐
- OpenFlow_tutorial_1_Introduce
tutorial出处:https://github.com/mininet/openflow-tutorial/wiki OpenFlow是用于远程控制交换机流表(forwarding tables) ...
- 两个自动配置IPv4
今天一早过来发现网络连接不上了,ipconfig一下后,发现ip并不是我固定配置的ip地址,而是变成了一个完全不一样的ip,点击本地连接,点击详细信息,发现有两个自动配置IPv4,原因可能是ip地址冲 ...
- CREATE INDEX - 定义一个新索引
SYNOPSIS CREATE [ UNIQUE ] INDEX name ON table [ USING method ] ( { column | ( expression ) } [ opcl ...
- CAD参数绘制填充(网页版)
填充是CAD图纸中不可或缺的对象,在机械设计行业,常常需要将零部件剖开,以表现其内部的细节,而这些被剖开的截面会用填充来表示:在工程设计行业,一些特殊的材料或地形,也会用填充来表示. js中实现代码说 ...
- idea开启/关闭单词拼写检查
- linux 小键盘 数字键盘 wiki
https://wiki.archlinux.org/index.php/Activating_Numlock_on_Bootup_(%E7%AE%80%E4%BD%93%E4%B8%AD%E6%96 ...
- PyTorch学习笔记——softmax和log_softmax的区别、CrossEntropyLoss() 与 NLLLoss() 的区别、log似然代价函数
1.softmax 函数 Softmax(x) 也是一个 non-linearity, 但它的特殊之处在于它通常是网络中一次操作. 这是因为它接受了一个实数向量并返回一个概率分布.其定义如下. 定义 ...
- ubuntu lamnp 环境的安装/卸载 及 配置
安装mysql--------------------------------------sudo apt install mysql-server #5.7版本 安装php----------- ...
- form 表单onclick事件 禁止表单form提交
最近遇到一次处理form数据的过滤,采用了button的onclick事件来检查,发现return false后表单仍然提交了. 于是仔细研究了下onclick.onsubmit.submit集合函数 ...
- web前端开发——css
一.css介绍 1.css是什么? Cascading Style Sheets缩写,层叠样式表.样式定义如何显示HTML元素,样式通常又会存在于样式表中. 2.为什么需要css? 使HTML页面变得 ...