写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. Careercup - Facebook面试题 - 4892713614835712

    2014-05-02 09:54 题目链接 原题: You have two numbers decomposed in binary representation, write a function ...

  2. How to use Android Activity's finish(), onDestory() and System.exit(0) methods

    Activity.finish() Calling this method will let the system know that the programmer wants the current ...

  3. Problem 1016 咒文卷轴 优先队列+前缀和+rmq

    题目链接: 题目 Problem 1016 咒文卷轴 Time Limit: 3000 mSec Memory Limit : 131072 KB 问题描述 小Y 是一个魔法师,有一天他获得了一卷神秘 ...

  4. Codeforces Beta Round #10 D. LCIS

    题目链接: http://www.codeforces.com/contest/10/problem/D D. LCIS time limit per test:1 secondmemory limi ...

  5. dede首页调用栏目内容{dedefield.content}的方法

    Dedecms的功能确实很强大,但是dedecms的全局变量有字节限制,使得我们在使用dedecms制作企业站的时候,首页无法调用大段大段的企业站. 其实dedecms还有另外一种调用大段内容的方法, ...

  6. ios开发之多线程

    多线程的主要是用来执行一些耗时操作,例如网络图片.视频.歌曲.书籍等资源下载,游戏中的音乐播放等,充分发挥多核处理器的优势,并发(同时执行)任务让系统运行的更快.更流畅. 介绍下比较常用的多线程技术, ...

  7. Emmet快速编写CSS样式

    基本的CSS样式编写时,很多样式只需输入首字母即可得到不带属性值的CSS样式,像上面说到的margin. 1.而对于一些带有特定的属性值的CSS样式,只需输入CSS标签与属性值的首字母就可以,比如: ...

  8. RAD项目结构

  9. POJ 3321 Apple Tree(后根遍历将树转化成序列,用树状数组维护)

    题意:一棵树,有很多分叉,每个分叉上最多有1个苹果. 给出n,接下来n-1行,每行u,v,表示分叉u,v之间有树枝相连.这里数据中u相当于树中的父节点,v相当于子节点. 给出两个操作: 1.C x  ...

  10. linux入门教程(十) 文档的压缩与打包

    在windows下我们接触最多的压缩文件就是.rar格式的了.但在linux下这样的格式是不能识别的,它有自己所特有的压缩工具.但有一种文件在windows和linux下都能使用那就是.zip格式的文 ...