jquery简单插件制作(fn.extend)完整实例


Posted in Javascript onMay 24, 2016

本文实例讲述了jquery简单插件制作方法。分享给大家供大家参考,具体如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
  <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
  <script type="text/javascript" src="jquery.js"></script>
  <title>jquery简单的插件制作</title>
  <script type="text/javascript">
  (function ( $ ) {
    $.fn.greenify = function ( options) {
      var settings = $.extend({
       color:"#556b2f",
       backgroundColor:'#000',
       padding:'20px'
      }, options );
      return this.css( {
        color:settings.color,
        backgroundColor : settings.backgroundColor,
        padding : settings.padding
      });
    };
  }( jQuery ));
  $(document).ready(function(){
    $("div").greenify({
      color:"#000",
      backgroundColor:'#ccc',
      padding:'50px'
    })
  });
  </script>
</head>
<body>
<div id="accordion">
jquery简单的插件制作
</div>
</body>
</html>

希望本文所述对大家jQuery程序设计有所帮助。

Javascript 相关文章推荐
JS无法捕获滚动条上的mouse up事件的原因猜想
Mar 21 Javascript
jquery ajax,ashx,json的用法总结
Feb 12 Javascript
Js+php实现异步拖拽上传文件
Jun 23 Javascript
javascript实现查找数组中最大值方法汇总
Feb 13 Javascript
jquery层级选择器(匹配父元素下的子元素实现代码)
Sep 05 Javascript
详解Angular2 关于*ngFor 嵌套循环
May 22 Javascript
node使用UEditor富文本编辑器的方法实例
Jul 11 Javascript
vue3.0 CLI - 1 - npm 安装与初始化的入门教程
Sep 14 Javascript
微信小程序遍历Echarts图表实现多个饼图
Apr 25 Javascript
Vue-router 报错NavigationDuplicated的解决方法
Mar 31 Javascript
Vue Object 的变化侦测实现代码
Apr 15 Javascript
使用vue-element-admin框架从后端动态获取菜单功能的实现
Apr 29 Vue.js
jQuery获取及设置表单input各种类型值的方法小结
May 24 #Javascript
jQuery+php实时获取及响应文本框输入内容的方法
May 24 #Javascript
jQuery中事件与动画的总结分享
May 24 #Javascript
jQuery根据表单name获取值的方法
May 24 #Javascript
深入理解jquery自定义动画animate()
May 24 #Javascript
深入理解jquery中的事件与动画
May 24 #Javascript
Jquery元素追加和删除的实现方法
May 24 #Javascript
You might like
基于PHP的简单采集数据入库程序
2014/07/30 PHP
动态加载图片路径 保持JavaScript控件的相对独立性
2010/09/03 Javascript
理解JavaScript中的对象 推荐
2011/01/09 Javascript
用JQuery实现表格隔行变色和突出显示当前行的代码
2012/02/10 Javascript
JS文本框不能输入空格验证方法
2013/03/19 Javascript
js获取select标签选中值的两种方式
2014/01/09 Javascript
JS小游戏之象棋暗棋源码详解
2014/09/25 Javascript
javascript+HTML5 Canvas绘制转盘抽奖
2020/05/16 Javascript
JavaScript递归操作实例浅析
2016/10/31 Javascript
JavaScript 函数的定义-调用、注意事项
2017/04/16 Javascript
Bootstrap布局之栅格系统学习笔记
2017/05/04 Javascript
Node接收电子邮件的实例代码
2017/07/21 Javascript
Vue使用vue-cli创建项目
2017/09/01 Javascript
vue拦截器实现统一token,并兼容IE9验证功能
2018/04/26 Javascript
JS拖拽排序插件Sortable.js用法实例分析
2019/02/20 Javascript
vue-cli 3.x配置跨域代理的实现方法
2019/04/12 Javascript
vue 中几种传值方法(3种)
2019/11/12 Javascript
Python中为feedparser设置超时时间避免堵塞
2014/09/28 Python
Python闭包的两个注意事项(推荐)
2017/03/20 Python
pygame 精灵的行走及二段跳的实现方法(必看篇)
2017/07/10 Python
Python实现多线程/多进程的TCP服务器
2019/09/03 Python
python 实现快速生成连续、随机字母列表
2019/11/28 Python
Python开发之身份证验证库id_validator验证身份证号合法性及根据身份证号返回住址年龄等信息
2020/03/20 Python
Python Dict找出value大于某值或key大于某值的所有项方式
2020/06/05 Python
用python实现前向分词最大匹配算法的示例代码
2020/08/06 Python
Python类成员继承重写的实现
2020/09/16 Python
利用CSS3的3D效果制作正方体
2020/03/10 HTML / CSS
基于html5实现的图片墙效果
2014/10/16 HTML / CSS
ECCO英国官网:丹麦鞋履品牌
2019/09/03 全球购物
汽车维修专业毕业生的求职信分享
2013/12/04 职场文书
五好关工委申报材料
2014/05/31 职场文书
辞职信怎么写
2015/02/27 职场文书
检讨书模板大全
2015/05/07 职场文书
导游词之山东红叶谷
2019/10/31 职场文书
看看如何用Python绘制小米新版天价logo
2021/04/20 Python
Python常用配置文件ini、json、yaml读写总结
2021/07/09 Python