写JS插件,最好是先通过HTML方式将展示结果显示出来,然后再封装成JS插件,将其画出来。JS模板如下:

(function($){
$.fn.fnName = function(options){
var opts = $.extend({},$.fn.fnName.Defaults,options);
return this.each(function(){
var $window;
CreateTemplate(this); // 创建模板,也就是拼接一个界面
SetStyleForTemplate(); // 给模板添加样式
SetEventForTemplate(); //添加事件 function CreateTemplate(w){
$window = $(w);
var arrcontent = [];
arrcontent.push("*********");
*************************** //拼接
CreateSubTemplate(arrcontent);//分支拼接,特殊情况利于层次分明 $window.html(arrcontent.join(""));
arrcontent = null;
} functon CreateSubTemplate(arrcontent){
arrcontent.push("*********");
} function SetStyleForTemplate(){
$window.find("***")*************;//设置样式
} function SetEventForTemplate(){
$window.find("***")************;//添加事件
}
});
};
$.fn.fnName.Defaults ={
// 默认参数
};
})(jQuery);

  

javascript插件编写小结的更多相关文章

  1. 原生JavaScript插件编写指南(转载)

    原生js开发指南 https://www.jianshu.com/p/e65c246beac1 在jQuery大量使用的环境下,目前网上的众多jQuery插件也能基本满足要求,但是在项目具体需求下,有 ...

  2. JavaScript插件编写指南

    在编写插件之前,大家要先了解做插件的几个要点: 插件需要满足的条件 一个可复用的插件需要满足以下条件: 插件自身的作用域与用户当前的作用域相互独立,也就是插件内部的私有变量不能影响使用者的环境变量: ...

  3. jQuery插件编写及链式编程模型小结

    JQuery极大的提高了我们编写JavaScript的效率,让我们可以愉快的编写代码,做出各种特效.大多数情况下,我们都是使用别人开发的JQuery插件,今天我们就来看看如何把我们常用的功能做出JQu ...

  4. 关于chrome插件编写的小结

    一个插件的大致目录结构如下: 其中manifest文件最为重要,它定义/指明插件应用的相关信息(权限.版本.功能说明等),点此查看Manifest的详情>>   这里有一篇chrome官方 ...

  5. javascript&&jquery编写插件模板

    javascrpt插件编写模板 这里不分享如何编写插件,只留一个框架模板,使用面向对象的形式进行编写,方便管理 ;(function(window,document){ function FnName ...

  6. jQuery插件编写及链式编程模型

    jQuery插件编写及链式编程模型小结 JQuery极大的提高了我们编写JavaScript的效率,让我们可以愉快的编写代码,做出各种特效.大多数情况下,我们都是使用别人开发的JQuery插件,今天我 ...

  7. Javascript本地存储小结

    前言 总括:详细讲述Cookie,LocalStorge,SesstionStorge的区别和用法. 人生如画,岁月如歌. 原文博客地址:Javascript本地存储小结 知乎专栏&& ...

  8. Bootstrap JavaScript插件

      在bs3.X中,提供了12种JavaScript插件,分别是:动画过渡(Transition).模态弹窗(Modal).下拉菜单(Dropdown).滚动侦测(Scrollspy).选项卡(Tab ...

  9. 初学者--bootstrap(五)JavaScript插件(上)----在路上(6)

    jQuery 插件为 Bootstrap 的组件赋予了“生命”.可以简单地一次性引入所有插件,或者逐个引入到你的页面中. 一:首先要确认的是,单个还是全部引入: JavaScript 插件可以单个引入 ...

随机推荐

  1. Oracle 中 for update 和 for update nowait 的区别

    原文出处http://bijian1013.iteye.com/blog/1895412 一.for update 和 for update nowait 的区别 首先一点,如果只是select 的话 ...

  2. android编程常见问题-No Launcher activity found!

    新手编程常见的问题: 问题表现: console提示:No Launcher activity found! The launch will only sync the application pac ...

  3. javascript_22_for_js性感的v

    <script type="text/javascript"> window.onload=function(){ var aDiv=document.getEleme ...

  4. 阿里云CentOS6.3 安装MongoDB教程

    安装说明 系统环境:Centos-6.3安装软件:mongodb-linux-x86_64-2.2.2.tgz下载地址:http://www.mongodb.org/downloads安装机器:192 ...

  5. 项目中的Libevent(多线程)

    多线程版Libevent //保存线程的结构体 struct LibeventThread { LibEvtServer* that; //用作传参 std::shared_ptr<std::t ...

  6. NC保存报dirty解决方法

    在NC UI端测试保存的时候报  " The data whose initcode is 6033 is dirty! " 错误,其解决方式是 在IHrPf接口中添加你的单据模板编号 和 参数模板 ...

  7. Ignore files which are already versioned

    If you accidentally added some files which should have been ignored, how do you get them out of vers ...

  8. Unity3D脚本中文系列教程(四)

    http://dong2008hong.blog.163.com/blog/static/4696882720140302451146/ Unity3D脚本中文系列教程(三) 送到动画事件. ◆ va ...

  9. Iptables DDOS/CC 自动屏蔽脚本

    Iptables DDOS/CC 自动屏蔽脚本 May 20, 2013 最近不停地被 CC (DDOS的一种)频繁干扰,分享一个 iptables 屏蔽 DDOS 的脚本.让 crond 每分钟运行 ...

  10. 【C++之STL】理解容器(ing)

    “容器可容纳一些数据的模板类” “容器是包容其他对象的对象” 两种类型:顺序容器.关联容器   顺序容器 关联容器 访问成员 顺序访问和随机访问 经过优化关键键值访问                 ...