`

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);  


jQuery为开发插件提拱了两个方法,分别是:

jQuery.fn.extend(object);  给jQuery对象添加方法。
jQuery.extend(object);  为扩展jQuery类本身.为类添加新的方法。



jQuery.extend(object); 

为jQuery类添加添加类方法,可以理解为添加静态方法。如:

$.extend({ 

    add:function(a,b){return a+b;} 

}); 

便为 jQuery 添加一个为 add 的 “静态方法”,之后便可以在引入 jQuery 的地方,使用这个方法了,$.add(3,4); //return 7
分享到:
评论

相关推荐

    JQuery 插件模板 制作jquery插件的朋友可以参考下

    本篇文章将详细讲解如何基于提供的JQuery插件模板来制作自己的jQuery插件。 首先,让我们解析一下给出的模板代码: ```javascript ;(function($) { // 私有函数 var p = {}; p.func1 = function() { }; // 主...

    推荐一款jQuery插件模板

    jQuery插件模板是指为了增强jQuery的功能而开发的扩展模块。一个优秀的插件模板不仅能够简化开发过程,还能提供更多可定制化选项,提升插件的复用性及灵活性。本文推荐的jQuery插件模板具有简洁和灵活的特点,易于...

    基于Jquery插件的 Web 快速开发工具

    此外,工具还可能提供了一些常用的Jquery插件模板,如Bootstrap、jQuery Validate等,以便开发者快速启动新功能的开发。这不仅可以节省时间,还可以确保代码质量,因为生成的代码通常遵循最佳实践和标准。 在实际...

    自定义jquery插件:为jquery加入Notification机制

    下面是一个基本的jQuery插件模板: ```javascript (function($) { $.fn.myPlugin = function(options) { this.each(function() { // 插件的核心逻辑 }); }; })(jQuery); ``` 在我们的案例中,我们要创建的...

    JQ jQuery插件如何开发

    以下是一个基础的jQuery插件模板: ```javascript (function($) { $.fn.myPlugin = function(options) { // 插件代码 return this; // 保持链式调用 }; })(jQuery); ``` 在这个模板中,`$.fn`是jQuery函数的...

    jquery 插件.zip

    例如,一个简单的jQuery插件模板如下: ```javascript (function($){ $.fn.myPlugin = function(options) { var defaults = {...}; var settings = $.extend({}, defaults, options); return this.each...

    深入理解jQuery插件开发 - WEB开发者1

    以下是一个基础的jQuery插件模板: ```javascript (function($) { // 插件代码 })(jQuery); ``` 在这个函数内部,我们可以定义私有函数,这些函数不会被外部访问,例如: ```javascript var privateFunction = ...

    基于jQuery插件实现的多种模拟扑克牌切换动画特效源码.zip

    以下是一个基础的jQuery插件模板: ```javascript (function($) { $.fn.flipCard = function(options) { // 插件的主要代码 }; })(jQuery); ``` 在这个插件内部,`this`关键字将引用到选择的jQuery对象,这使得...

    jquery 插件 文本框输入限制 汉字,字母

    下面是一个基础的jQuery插件模板: ```javascript (function($) { $.fn.extend({ pluginName: function(options) { // 插件代码 } }); })(jQuery); ``` 在这个例子中,`pluginName`是你要创建的插件名,可以...

    jquery前台模板demo(很实用的)

    在jQuery中,虽然没有内置的模板引擎,但可以借助第三方库如Mustache、Handlebars或jQuery自己的插件如jQuery tmpl来实现。这些模板引擎支持各种模板语法,使开发者能够灵活地设计和渲染数据。 **四、使用jQuery...

    jquery分页插件AmSetPager(自写)

    第一次做的插件,早写好了,后来发现一个jquery插件模板,就拿过来套。名字叫jquery.boilerplate.js。我的理解不是很深,也不太理解太多效率问题。 本来我是一个做asp.net开发的,可是公司好些个人包括美工没太会js...

    jquery-plugin-template:用于创建jQuery插件的模板。 基于jQuery-boilerplate,内置测试开始

    jQuery插件模板 一个基于jQuery插件模板和George Paterson的的测试配置。 用法 包括jQuery: &lt; script src =" http://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js " &gt; &lt;/ script &gt; ...

    jQuery天气预报插件模板.zip

    《jQuery天气预报插件模板详解》 在网页设计与开发中,为了提升用户体验,许多开发者会集成实时天气预报功能。jQuery作为一个轻量级、高效且易用的JavaScript库,为实现这一功能提供了便利。本篇文章将详细介绍一个...

    开发jQuery插件

    下面是一个基本的jQuery插件模板: ```javascript (function($){ $.fn.myPlugin = function(options) { // 插件的主要逻辑 // ... }; })(jQuery); ``` 这里的`$.fn`是jQuery对象的原型,所以当我们给`$.fn`...

    很好的Jquery网页模板

    同时,由于jQuery的普及性,网上有大量的教程和插件资源,可以进一步丰富和增强模板的功能。 总结来说,这个"很好的jQuery网页模板"是前端开发者的强大工具,它集成了美观的界面设计和强大的jQuery功能,帮助快速...

    Jquery 视图插件,模板插件,日期插件 案例

    在这个“Jquery 视图插件,模板插件,日期插件 案例”中,我们将深入探讨jQuery如何通过扩展增强其在用户界面呈现和管理上的能力。以下是关于这些主题的详细讨论: 1. **jQuery 视图插件**: jQuery视图插件通常...

    jQuery插件集之(页面模板)多个+Demo

    本资源包“jQuery插件集之(页面模板)多个+Demo”聚焦于利用jQuery来创建和应用页面模板,为不熟悉插件使用的用户提供便捷。通过这个包,你可以获得三个不同的静态页面模板效果,帮助你更好地理解和应用jQuery插件。 ...

    jQuery插件 简单日期设置

    本主题聚焦于"jQuery插件 简单日期设置",这通常指的是利用jQuery来创建一个简单易用的日历插件,只用于选择日期,不涉及时间选择,适用于那些只需要日期输入的场景。 首先,我们了解jQuery插件的基本结构。一个...

    dreamwever jQuery 插件

    通过在Dreamweaver中使用jQuery插件,开发者可以更方便地插入jQuery代码,提高开发效率。 首先,让我们详细了解一下Dreamweaver中的jQuery插件如何工作。在安装插件后,用户可以在代码编辑器中直接访问jQuery库,...

Global site tag (gtag.js) - Google Analytics