编写JQuery插件-3
该了解我们也知道的差不多了,接下来编写我们第一个jq插件吧
封装对象方法的插件
我们编写一个设置和获取颜色的插件,我们需要实现两个功能
1、设置匹配元素的颜色
2、获取匹配元素(元素集合的第一个)的颜色
我们采用jQuery.fn.extend(),代码如下:
;(function($){
/* code */
})(jQuery)
这是最外层的架构,接下来;
;(function($){
$.fn.extend({
color:function(val){
// code
}
});
})(jQuery)
我在里面添加相应的代码
;(function($){
$.fn.extend({
color:function(val){
console.log(val);
if(val == undefined){
return this.css('color');
}
else{
return this.css('color',val);
}
}
});
})(jQuery)
我们采用jq 的css()方法和获取颜色值;插件的this指向的是jq对象,如果插件不返回特定的值或字符串,应该使其具有可连性,为此直接返回this对象,由于css()方法定义了的返回对象,直接返回即可;
封装我们的jq.color.js
页面调用 该js
console.log($("div").color());
console.log($("div").color("red"));
编写JQuery插件-3的更多相关文章
- 编写jQuery插件--实现返回顶部插件
国庆过去一周多了,作为IT界的具有严重’工作狂‘性质的宅人,居然还没走出玩耍的心情,拖了程序猿的脚后跟了.最近工作不顺,心情不佳,想吐槽下公司,想了还是厚道点,以彼之道还施彼身,觉得自己也和他们同流合 ...
- 编写jQuery插件(一)——插件约定及插件中的闭包
编写插件的目的是给已经有的一系列方法或函数做一个封装,以便在其他地方重复使用,提高开发效率和方便后期维护. 在编写jQuery插件的时候,我们一般会遵循一些约定: jQuery插件推荐命名为:jque ...
- 自己编写jQuery插件之表单验证
自己编写jQuery插件之表单验证 吐个嘈先:最近状态不咋滴,真是什么都不想干,不想上班,做什么都没动力,觉得没意思.不想这样,不想这样,快让这种情绪消失吧,忽忽.... 表单验证在项目中用的还是比较 ...
- 自己编写jQuery插件之Tab切换
自己编写jQuery插件之 Tabs切换 jquery ui 带有Tabs切换插件,但其css样式太难维护,引用的东西太多,因此就自己写了个. 起初我Html代码架子是这样的: <div cla ...
- 编写jQuery插件的方法和注意点
编写jQuery插件的方法和注意点 插件的种类 jQuery的插件主要分为3种类型. 1. 封装对象方法的插件 这种插件是将对象方法封装起来,用于对通过选择器获取的jQuery对象进行操作,是最常见的 ...
- 如何编写JQuery 插件详解
转载自:http://blog.sina.com.cn/s/blog_6154bf970101jam7.html 如今做web开发,jquery 几乎是必不可少的,就连vs神器在2010版本开始将Jq ...
- 如何用正确的姿势编写jQuery插件
在园子里有很多关于jQuery插件的文章,尤其 以下2篇文章: 不定义JQuery插件,不要说会JQuery jQuery插件开发精品教程,让你的jQuery提升一个台阶 这2位大神基础讲的很清楚,在 ...
- 如何编写jQuery插件
要说jQuery 最成功的地方,我认为是它的可扩展性吸引了众多开发者为其开发插件,从而建立起了一个生态系统.这好比大公司们争相做平台一样,得平台者得天下.苹果,微软,谷歌等巨头,都有各自的平台及生态圈 ...
- 编写jQuery 插件
编写jQuery Plugin,要设置默认值,并允许用户修改默认值,或者运行是传入其他值. 最终,我们得出编写一个jQuery插件的原则: 给$.fn绑定函数,实现插件的代码逻辑: 插件函数最后要 r ...
- 编写jquery插件的分享
一.类级别($.extend) 类级别你可以理解为拓展jquery类,最明显的例子是$.ajax(...),相当于静态方法. 开发扩展其方法时使用$.extend方法,即jQuery.extend(o ...
随机推荐
- Lua学习系列(一)
从现在开始,打算学习一门新的脚本语言-lua. 1.什么是lua? a) lua1 • Lua 1.0 was implemented as a library, in less then 6000 ...
- fedora 挂载 小米手机 (估计其它android设备也是类似操作)
1 参考ubuntu挂载 在Ubuntu挂载使用MTP设备步骤如下: 1.将MTP设备连接至PC机 2.如果是第一次使用MTP设备需要安装以下软件,否则可以跳过此步骤: $ sudo apt-get ...
- D. PolandBall and Polygon BIT + 欧拉公式
http://codeforces.com/contest/755/problem/D // 我也觉得非平面图不能用欧拉公式,但是也能过,不知道为什么.求大佬留言. 这题其实就是平面图,因为它有很多个 ...
- Rest之路 -- 从第二个Rest application里面分析 Rest 方法
引言 在此之前,我们实现了第一个Rest application,通过分析她,我们了解了 Rest 程序的基本要素:这里,我们将会对第一个 Rest application 的功能进行扩充(实现 CR ...
- bitmap格式分析(转)
源:bitmap格式分析 参考:bitmap图像介绍 最近正在着手开发一个图片库,也就是实现对常见图片格式的度写操作.作为总结与积累,我会把这些图片格式以及加载的实现写在我的Blog上. 说到图片,位 ...
- onchange、oninput、onpropertyChange事件的异同
onchange事件适用于input\textarea\select元素上,支持各大浏览器,该事件只有在键盘或者鼠标操作改变对象属性,且失去焦点时触发,脚本触发无效: oninput事件适用于inpu ...
- Android SQLite 加入自定义函数
SQLite Database 自定义函数实现: //Here's how to create a function that finds the first character of a strin ...
- STL中list用法
本文以List容器为例子,介绍了STL的基本内容,从容器到迭代器,再到普通函数,而且例子丰富,通俗易懂.不失为STL的入门文章,新手不容错过! 0 前言 1 定义一个list 2 使用list的成员函 ...
- 在 WindowMobile 上的模拟LED 显示屏插件(转)
源:在 WindowMobile 上的模拟LED 显示屏插件 我在给一个对话框上的控件查找翻看合适的图标时,无形中看到了一个LED显示屏的图标,这里所说的LED显示屏是指由很多LED灯密集排列组成的点 ...
- vuejs 子组件传递父组件的第二种方式
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...