jQuery $.extend()使用方法
$.extend()使用方法总结。
jQuery为开发插件提拱了两个方法,各自是:
jQuery.fn.extend(object);
jQuery.extend(object);
jQuery.extend(object);为扩展jQuery类本身.为类加入新的方法。
jQuery.fn.extend(object);给jQuery对象加入方法。
这个应该非常好理解吧。
举个样例。
<span style="font-size:18px;"><html>
<head>
<title></title>
</head>
<body>
<h3 class="ye">new soul</h3>
<h3 class="ye">new soul</h3>
<h3 class="ye">new soul</h3>
<h3 class="ye">new soul</h3>
<script type="text/javascript" src="jquery.2.0.3.js"></script>
<script type="text/javascript">
jQuery.fn.myPlugin = function(options) {
$options = $.extend( {
html: "no messages",
css: {
"color": "red",
"font-size":"14px"
}},
options);
return $(this).css({
"color": $options.css.color, }).html($options.html);
} $('.ye').myPlugin({html:"So easy,yes? ",css:{"color":"green","font-size":"20px"}});
</script>
</body>
</html>
</span>
好的,上面你也看到了一点点$.extend()的使用方法。
1.合并多个对象。
这里使用的就是$.extend()的嵌套多个对象的功能。
所谓嵌套多个对象,有点类似于数组的合并的操作。
可是这里是对象。举例说明。
<span style="font-size:18px;">//使用方法: jQuery.extend(obj1,obj2,obj3,..)
var Css1={size: "10px",style: "oblique"}
var Css2={size: "12px",style: "oblique",weight: "bolder"}
$.jQuery.extend(Css1,Css2)
//结果:Css1的size属性被覆盖,并且继承了Css2的weight属性
// Css1 = {size: "12px",style: "oblique",weight: "bolder"}
</span>
2.深度嵌套对象。
<span style="font-size:18px;"> jQuery.extend(
{ name: “John”, location: { city: “Boston” } },
{ last: “Resig”, location: { state: “MA” } }
);
// 结果:
// => { name: “John”, last: “Resig”, location: { state: “MA” } }
// 新的更深入的 .extend()
jQuery.extend( true,
{ name: “John”, location: { city: “Boston” } },
{ last: “Resig”, location: { state: “MA” } }
);
// 结果
// => { name: “John”, last: “Resig”,
// location: { city: “Boston”, state: “MA” } }
</span>
3.能够给jQuery加入静态方法。
<span style="font-size:18px;"><html>
<head>
<title></title>
</head>
<body>
<script type="text/javascript" src="jquery.2.0.3.js"></script>
<script type="text/javascript">
$.extend({
add:function(a,b){return a+b;},
minus:function(a,b){return a-b},
multiply:function(a,b){return a*b;},
divide:function(a,b){return Math.floor(a/b);}
}); var sum = $.add(3,5)+$.minus(3,5)+$.multiply(3,5)+$.divide(5,7);
console.log(sum);
</script>
</body>
</html></span>
Best Wishes
jQuery $.extend()使用方法的更多相关文章
- JQuery的extend扩展方法
jQuery.extend 函数使用详解 JQuery的extend扩展方法: Jquery的扩展方法extend是我们在写插件的过程中常用的方法,该方法有一些重载原型,在此,我们一起去 ...
- 列表中的index,extend,count方法
列表中的index,extend,count方法 #_author:Administrator#date:2019/10/24#1.index方法l=['blue','red','white','bl ...
- (转载)jQuery 1.6 源码学习(二)——core.js[2]之extend&ready方法
上次分析了extend方法的实现,而紧接着extend方法后面调用了jQuery.extend()方法(core.js 359行),今天来看看究竟core.js里为jQuery对象扩展了哪些静态方法. ...
- jQuery.extend()、jQuery.fn.extend()扩展方法示例详解
jQuery自定义了jQuery.extend()和jQuery.fn.extend()方法.其中jQuery.extend()方法能够创建全局函数或者选择器,而jQuery.fn.extend()方 ...
- jQuery.extend()、jQuery.fn.extend()扩展方法具体解释
版权声明:本文为博主原创文章.未经博主同意不得转载. https://blog.csdn.net/dreamsunday/article/details/25193459 jQuery自己定义了jQu ...
- jquery 的extend的方法
用flot.js 用到了jquery的extend 方法 关于extend方法 我就照手册打一遍,加深一下理解,说实话其实我理解的也不透 extend 用一个或多个其他对象来扩展一个对象,返回被扩 ...
- Python-序列常用方法 + * += extend append方法区别
+ 两边都是相同序列类型.拼接成一个新的序列 print((1, 2, 3) + (4, 6)) print("beimenchuixue" + "ximenchuife ...
- jquery.extend方法
jquery.extend()用来扩展jquery中方法,实现插件. 1.jQuery.extend函数详细用法! 扩展jQuery静态方法. 1$.extend({ 2test:function() ...
- 从JS的深拷贝与浅拷贝到jq的$.extend()方法
一.堆内存与栈内存 堆和栈都是内存中划分出来的用来存储的区域,栈为自动分配的内存空间,它由系统自动释放,堆为动态分配的内存,大小不定也不会自动释放. 二.js基本数据类型与引用类型的不同 基本数据类型 ...
随机推荐
- JVM总结-内存监视手段及各区域内存溢出解决
转载:https://blog.csdn.net/xuqu_volition/article/details/53786096 引言 本文仅关注一些常见的虚拟机内存监视手段,以及JVM运行时数据区各个 ...
- (LeetCode 153)Find Minimum in Rotated Sorted Array
Suppose a sorted array is rotated at some pivot unknown to you beforehand. (i.e., 0 1 2 4 5 6 7 migh ...
- Inception in CNN
之前也写过GoogLeNet的笔记.但那个时候对Inception有些似懂非懂,这周又一次看了一遍,觉得有了新的体会,特地又一次写一篇博客与它再续前缘. 本文属于论文笔记性质.特此声明. Networ ...
- shell 编程笔记
#! /bin/sh 寻找shell解释器 /bin/sh 是一个路径 #! /usr/bin/python 仅仅是寻找一个python的解释器 执行linux程序的方法: 使得文件具有可执行的权限 ...
- Android入门之简单拨号器
效果图: package jk.phone; import android.net.Uri; import android.os.Bundle; import android.app.Activity ...
- UML类图聚集与组合的区别
http://blog.csdn.net/zwf0713/article/details/2025922 设计模式中组合和聚集好像挺相似,但有一定区别. 1-在图上的区别是,聚集用空心,组合用实心: ...
- VarPtr 得到地址 指针
在Basic语言演变成QBasic,然后到Visual Basic之前,VarPtr函数就已经存在了.开始,这个函数存在于VB运行库1.0版中.通过声明可以调用这个函数: Declare Functi ...
- 【Oracle】性能优化
优化原则 1.在select语句中避免使用* 2.使用Truncate清空表 2.1语法 Truncate [table|cluster] shema.[table_name][cluster_nam ...
- eclipse查看源码失败总结
之前看的网上查看源码的方法,查看了JDK,只是知其然不知所以然. 后来发现要是查看其他源码,总是查看失败. 最开始每次点击Attach Source包到所要查看源码的jar包,但是还是这样. 但是依 ...
- S3 服务(Simple Storage Service简单存储服务) 简介(与hdfs同一级)
图1 spark 相关 亚马逊云存储之S3(Simple Storage Service简单存储服务) (转 ) S3是Simple Storage Service的缩写,即简单存储服务.亚马逊的名 ...