锋利的jQuery-7--一个$.fn.color插件的编写过程
编写一个设置和获取元素的color的插件:
首先实现第一个功能,设置:
;(function($){
$.fn.extend({
color:function(value){
return this.css("color",value); //css方法本身就是返回当前元素的jQuery对象
}
});
})(jQuery);
$("span").color("red"); //调用
然后实现第二个功能,获取:如果没传入value就是获取
;(function($){
$.fn.extend({
color:function(value){
if(value == 'undefined'){ //如果没传入值就是获取
return this.css("color");
}else{
return this.css("color",value); //css方法本身具有返回第一个匹配元素的样式值的功能,此处无需通过eq()来获取第一个元素
}
}
});
})(jQuery);
实际上,css方法内部已经有判断value值是否为undefined的机制,所以才可以根据传递参数的不同返回不同值。因此可以:
;(function($){
$.fn.extend({
color:function(value){
return this.css("color",value); //传值就是设置,没传就是取值
}
});
})(jQuery);
锋利的jQuery-7--一个$.fn.color插件的编写过程的更多相关文章
- 【锋利的jQuery】表单验证插件踩坑
和前几篇博文提到的一样,由于版本原因,[锋利的jQuery]表单验证插件部分又出现照着敲不出效果的情况. 书中的使用方法: 1. 引入jquery源文件, 2. 引入表单验证插件js文件, 3. 在f ...
- [jQuery]《锋利的jQuery》插件部分总结
/** * <锋利的jQuery>插件部分总结 * * jQuery插件推荐命名:jquery.name.js * * $.fn.extend用于封装对象方法的插件 * $.extend用 ...
- 《锋利的jQuery》笔记:插件的使用和写法
jQuery插件的种类 1.封装对象方法 这种插件是将对象方法封装起来,用于对通过选择器获取的jQuery对象进行操作,是最常见的一种插件.此类插件可以发挥出jQuery选择器的强大优势,有相当一部分 ...
- 锋利的jQuery(第二版)学习总结
通过对<锋利的jQuery>(第二版)一书的学习,发现此书讲解通俗易懂,是学习jQuery的一本很好的指导书,特作如下总结. 此书主要讲解了jQuery的常用操作,包括认识jQuery,j ...
- 锋利的jQuery学习总结
通过对<锋利的jQuery>(第二版)一书的学习,发现此书讲解通俗易懂,是学习jQuery的一本很好的指导书,特作如下总结.此书主要讲解了jQuery的常用操作,包括认识jQuery,jQ ...
- 锋利的jQuery
今天总要找点东西学习,其实有很多东西要记录,慢慢写,今天看书吧,这几天把这本书看完,这里记一些要点 从头开始记吧 第一章 认识jQuery $就是jQuery的简写 $(function(){}) 就 ...
- jquery自定义banner图滚动插件---(解决最后一张图片倒回第一张图片的bug)
banner图的滚动效果动画 最近做项目中banner滚动的时候遇到了一个小bug,当banner滚动到最后一张图再跳回第一张图时, 会出现默认的倒回第一张图的过渡效果,看了几个插件都是这样,所以自定 ...
- jQuery第七章插件的编写和使用
1.本章目标 编写jquery插件 2.插件 也称为扩展,是一种按照一定的规范的应用程序接口编写出来的程序 插件的目标是给已有的一系列函数做一个封装,以便在其他的地方复用,方便维护和开发效率 3.jq ...
- jQuery插件开发——全屏切换插件
这个插件包含三个部分:HTML结构.CSS代码和JS代码. HTML结构是固定的,结构如下: <!--全屏滚动--> <div class="fullpage-contai ...
随机推荐
- CAN开发中遇到的奇怪问题
问题背景: 之前在做USBCAN2开发过程中,遇到一个奇葩问题,当我们加上其中某一句代码时,我们的程序会走不下去,得不到数据,而且在调试的过程中,你也不能暂停,不然,你也得不到数据.后来参考网上一篇帖 ...
- WebSocket 服务器3
其实,在服务器的选择上很广,基本上,主流语言都有WebSocket的服务器端实现,而我们作为前端开发工程师,当然要选择现在比较火热的NodeJS作为我们的服务器端环境了.NodeJS本身并没有原生的W ...
- LeetCode:Palindrome Partitioning,Palindrome Partitioning II
LeetCode:Palindrome Partitioning 题目如下:(把一个字符串划分成几个回文子串,枚举所有可能的划分) Given a string s, partition s such ...
- dll,lib文件的导入
这里介绍了两种方式调用,不过我一般用的是第一种,比较方便. 1动态库函数的调用,可以采用静态链接的方式 ,主要步骤如下: 1) 包含DLL中导出的头文件. 2) 采用#pragma comment(l ...
- mongo里面根据对象字段的ID查询 db.Photo.find({'owner.$id':ObjectId('xxxx')}) , 并且使用forEach循环修改查询的数据
var ones = db.Photo.find({'owner.$id':ObjectId("5344f0dab7c58e8e098b4567")}) db.Photo.find ...
- [POJ2155]Matrix(二维树状数组)
题目:http://poj.org/problem?id=2155 中文题意: 给你一个初始全部为0的n*n矩阵,有如下操作 1.C x1 y1 x2 y2 把矩形(x1,y1,x2,y2)上的数全部 ...
- 软工实践练习——使用git进行代码管理心得
一.在Github上注册账户.其中创建organization在小组成员的账户上创建,并在其账户上创建了小组的版本库.在创建organization的过程中,参考了助教提供的博客:http://sef ...
- javascript 漏洞
1.javascript语言中,每一个对象都有一个对应的原型对象,称为prototype对象. 继承是基于原型的! 2.prototype对象的作用,就是定义所有实例对象共享的属性和方法! 3.“原 ...
- javascript函数自调用
1. 函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块. 2. 将函数用 “()”括起来, 后面再加一个“()” 3. javascript函数的内置对象arguments对象, 它包 ...
- 3.3.1实现Servlet
FirstServlet.java package com.helloweenvsfei.servlet; import java.io.IOException; import java.io.Pri ...