文档章节

jQuery 插件开发实例(二)

孟飞阳
 孟飞阳
发布于 2016/06/20 10:25
字数 136
阅读 175
收藏 0

#程序员薪资揭榜#你做程序员几年了?月薪多少?发量还在么?>>>

一个比较完整的jQuery插件代码示例:

// 创建一个闭包    
(function($) {    
  // 插件的定义    
  $.fn.hilight = function(options) {    
    debug(this);    
    // build main options before element iteration    
    var opts = $.extend({}, $.fn.hilight.defaults, options);    
    // iterate and reformat each matched element    
    return this.each(function() {    
      $this = $(this);    
      // build element specific options    
      var o = $.meta ? $.extend({}, opts, $this.data()) : opts;    
      // update element styles    
      $this.css({    
        backgroundColor: o.background,    
        color: o.foreground    
      });    
      var markup = $this.html();    
      // call our format function    
      markup = $.fn.hilight.format(markup);    
      $this.html(markup);    
    });    
  };    
  // 私有函数:debugging    
  function debug($obj) {    
    if (window.console && window.console.log)    
      window.console.log('hilight selection count: ' + $obj.size());    
  };    
  // 定义暴露format函数    
  $.fn.hilight.format = function(txt) {    
    return '<strong>' + txt + '</strong>';    
  };    
  // 插件的defaults    
  $.fn.hilight.defaults = {    
    foreground: 'red',    
    background: 'yellow'    
  };    
// 闭包结束    
})(jQuery);     
 

 

© 著作权归作者所有

孟飞阳

孟飞阳

粉丝 223
博文 1070
码字总数 570879
作品 5
朝阳
个人站长
私信 提问
加载中

评论(0)

jQuery框架-3.jQuery自定义封装插件和第三方插件

一、jQuery的封装扩展 1、jQuery中extend方法使用 (挂在到jQuery和jQuery.fn两对象身上的使用) 1.1、官方文档定义: jQuery.extend Merge the contents of two or more objects together i...

osc_b5qcjovn
2018/03/26
4
0
jquery.fn.extend与jquery.extend

jQuery为开发插件提拱了两个方法,分别是: JavaScript代码 jQuery.fn.extend(object); jQuery.extend(object); jQuery.extend(object); 为扩展jQuery类本身.为类添加新的方法。 jQuery.fn....

i33
2012/06/29
129
0
深入理解jQuery插件开发总结(一)

由于这篇文章比较长,所以分了四个阶段讲,从简单的入门级到最后到综合级,有些列子和图片都是转载其他博主的,希望对想写插件对同学会有帮助。这里分享个好久之前写的一个jquery插件(网站的...

osc_gfiuebly
2018/12/10
5
0
jquery.fn.extend与jquery.extend

jQuery为开发插件提拱了两个方法,分别是: JavaScript代码 jQuery.extend(object); 为扩展jQuery类本身.为类添加新的方法。 jQuery.fn.extend(object);给jQuery对象添加方法。 fn 是什么东西...

柒月-小妖精
2013/09/06
112
0
jQuery中 $.fn的用法

jquery $.fn $.fx是什么意思 $.fn是指jquery的命名空间,加上fn上的方法及属性,会对jquery实例每一个有效。 如扩展$.fn.abc(),即$.fn.abc()是对jquery扩展了一个abc方法,那么后面你的每一个...

-wangming-
2015/02/05
56
0

没有更多内容

加载失败,请刷新页面

加载更多

好的可视化编辑器收集

国内 https://www.ivx.cn/index 国外 https://vectr.com

lilugirl
32分钟前
15
0
怎么在分享流程图的时候设置密码?迅捷画图教你保密小技巧!

怎么在分享流程图的时候设置密码?相信大家对分享链接和密码已经不陌生了,毕竟现在分享资源主要用的网盘、网站等等,基本上都需要先获取密码,才能进入分享链接页面,从分享资源的角度来说,...

赛利亚大姐大
33分钟前
13
0
如何在Mac电脑中输入多种标点符号和文字表情

特殊的标点符号和表情怎么输入?MAC电脑有自己自带的输入法,但是对于一些表情符号很多人都不知道在哪里使用,现在就来介绍一下MAC如何输入多种标点符号和文字表情。 1、首先我们打开备忘录,...

mac小叮当
42分钟前
17
0
Ubuntu替换国内源

网络环境的原因,官方的apt的源的速度比较慢,打算替换为国内源,正好学校有Ubuntu的源,所以替换下 编辑文件/etc/apt/sources.list 将其中的内容换为对应的系统的目标源即可。 选择你的ubu...

zhangwenwen
今天
14
0
持续交付的最后一英里

如果开发人员的变更集在集成时并没有实现长期部署就绪的状态,那么你的团队其实就没有真正的实践持续交付。 想要完全优化产品开发周期,你需要在团队中强调无缝部署的重要性,使每位工程师都...

京东智联云开发者
今天
18
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部