是什么?
所谓“插件”,就是用户自己新增的jQuery实例对象的方法。
原理:
jQuery插件是定义在jQuery构造函数的prototype对象上面的一个方法,这样做就能使得所有jQuery对象的实例都能共享这个方法。
注意:
♣始终包裹在一个封闭的插件.
♣不要冗余包裹this关键字在插件的功能范围内.【插件内部,this关键字指的是jQuery对象的实例。而在一般的jQuery回调函数之中,this关键字指的是DOM对象。】
♣除非插件返回特定值,否则总是返回jQuery对象来维持链式操作
♣不要在一个插件中多次命名不同方法
//避免和其他JavaScript库冲突,将jQuery传递给一个自执行的封闭程序,jQuery在此程序中映射为$符号,这样可以避免$号被其他库覆写。
//最前面有一个分号,是为了防止多个脚本文件合并时,其他脚本的结尾语句没有添加分号,造成运行时错误。
;(function ($) {
$.fn.myPlugin = function () {
//你自己的插件代码
};
})(jQuery);
把顶层对象(window)作为参数输入,这样可以加快代码的执行速度和执行更有效的最小化操作:
;(function ($, window) {
$.fn.myPlugin = function() {
//你自己的插件代码
};
}(jQuery, window));
使用extend方法,为参数对象设置属性的默认值:
;(function ($) {
$.fn.myPlugin = function (options) {
//创建一些默认值,拓展任何被提供的选项
var settings = $.extend({
'location': 'top',
'background-color': 'blue'
}, options);
return this.each(function (){
// 你自己的插件代码
});
};
})(jQuery);
参考:
http://www.css88.com/archives/4821
http://javascript.ruanyifeng.com/jquery/plugin.html
推荐一个比较全面的jQuery插件网站:
http://www.jq22.com/
分享到:
相关推荐
jquery插件开发快速入门
jquery插件开发入门
本文详细介绍基于jQuery开发插件的方式及步骤,其中附有代码和说明,是jq插件开发的入门教程。jQuery为开发插件提拱了两个方法,分别是: jQuery.fn.extend(object); 给jQuery对象添加方法。 jQuery.extend(object);...
jQuery-插件空白jQuery插件开发的快速入门
这篇文章将概述jQuery插件开发的基本知识,最佳做法和常见的陷阱。 一、入门 编写一个jQuery插件开始于给jQuery.fn加入新的功能属性,此处添加的对象属性的名称就是你插件的名称: 代码如下:jQuery.fn.myPlugin ...
PPT课件,从入门到深入,讲述jQuery的各种便捷用法,提高我们的开发效率。 jQuery是一个快速的,简洁的javaScript库,使用户能更方便地处理HTML documents、events、实现动画效果,并且方便地为网站提供AJAX交互。 ...
一个jQuery插件脚手架,可帮助快速开发jQuery插件。 这是我用来开始编写新jQuery插件的jQuery插件脚手架。 特征 简单的目录结构 周到的插件支架 基于Grunt的文件观看/缩小 配置测试页以便于开发 作者 Wil Neeley( ...
Write Less, Do More, 超详细的jQuery学习笔记,深入了解jQuery的语法,为前段开发带来更多的方便
本书分为4篇,*篇是移动开发入门篇,介绍了jQuery Mobile、HTML 5和移动开发的一些基础知识,以及如何搭建开发环境;第二篇是jQuery Mobile基础篇,介绍了jQuery Mobile中对话框、工具栏、按钮、表单、布局和插件的...
简单的例子带你走进jq插件的开发!通俗易懂,入门首选!
这篇文章将概述jQuery插件开发的基本知识,最佳做法和常见的陷阱。 一、入门 编写一个jQuery插件开始于给jQuery.fn加入新的功能属性,此处添加的对象属性的名称就是你插件的名称: . 代码如下: jQuery.fn....
jquery的开发教程 入门到精通 包括jquery插件开发的技术
jQuery 插件开发的快速入门 所以,您已经尝试过编写 jQuery 插件,并且很容易将一些可能有效的东西放在一起。 惊人的! 问题是,您认为可能有更好的方式来编写它们 - 您已经看到它们在野外以多种不同的方式完成,但...
jQuery 1 9 1英文版帮助文档 包括3个部分内容:学习中心(Learning Center) JQuery API JQuery UI API 其中学习中心有JS入门基础 JQuery的相关核心概念 J插件常识和性能方面建议 JQuery Mobile 移动开发)等 内容比...
第1章 jQuery开发入门/1 1.1 jQuery概述/2 1.1.1 认识jQuery /2 1.1.2 jQuery基本功能/2 1.1.3 搭建jQuery开发环境/3 1.1.4 编写第一个简单的jQuery应用/3 1.1.5 jQuery程序的代码风格/5 1.2 jQuery的简单...
jQuery入门指南教程 这个指南是一个对jQuery库的说明,要求读者了解HTML(DOM)和CSS的一些常识。它包括了一个简单的Hello World的例子,选择器和事件基础,AJAX、FX的用法,以及如何制作jQuery的插件。 这个指南包括...
第5章jQuery Mobile入门 l jQuery Mobile入门 1.1 jQuery Mobile简介 1.2 jQuery Mobile准备文档 1.3 jQuery Mobile架构 1.3.1 jQuery Mobile属性 1.3.2 jQuery Mobile主题 1.3.3 jQuery Mobile视图 操作案例1:制作...
clippy-jquery是一个jQuery插件,旨在使 SWF简单易用。 要求 jQuery(在测试) Flash(仅Web浏览器插件,无需Flash开发)。 入门 加载jQuery和插件: <!-- use local jQuery if you prefer --> [removed]...
开发周期短,上手快,入门低,但是进阶难一般常用的jquery特效 jquery焦点图 jquery选项卡 jquery滚动条 jquery下拉广告,jquery图片延时加载等,jquery代码,放大镜特效,jquery广告代码,jquery导航,jquery在线客服...
jQuery是一款同prototype一样优秀js开发库类,特别是对css和XPath的支持,使我们写js变得更加方便!如果你不是个js高手又想写出优 秀的js效果,jQuery可以帮你达到目的! 下载地址:Starterkit ...