jQuery编写widget的一些技巧分享


Posted in Javascript onOctober 28, 2010

1、在编写widget的时候,一般我们需要绑定一些事件,最好将这些widget的绑定事件加上当前widget的命名空间。如果同一个jQuery对象,使用了两个widget,而两个widget都绑定了相同的事件名称,可能会出现问题。在销毁widget的时候,去除绑定事件也很方便,只需要unbind(”.namespace“)就可以了。
2、在写jQuery的时候,因为jQuery对象是支持连写的。譬如:$(obj).css("height","20px").attr("title","abc")....
3、在编写的时候可以利用javascript的原生方法来避免switch。

switch(a) 
{ 
case "aa": 


this._set_aa(); 


break; 

case "bb": 


this._set_bb(); 


break; 

case "cc" 


this._set_cc(); 


break; 
}

上面的代码可以用下面的代码替换
this["_set_"+a]();

4、尽量缓存jQuery对象,和各种变量。这样可以提高脚本的性能
5、采用变量缓存this指针,在最小化代码的时候this可以被最小化掉。
6、最好将css类名取一致的名称,然后定义变量保存起来。在使用的时候直接采用变量,这样就算css名称有调整,只需要改变变量缓存的值即可。同时代码在最小化的时候也能减小体积。
7、setOption的时候,如果一个option是复杂对象,而不是简单的值对象,最好不要简单的this.options[key]=value.而在这之前需要将value和以前的option的值做一个extend,然后在赋值,这样可以保留复杂对象原有的部分值。比如:
var a = {width:120,height:200}; 
var c={width:200}; 
a=c; 
a=$.extend(a,c);

其结果是第一个a将是{width:20},会丢失掉height:200;而下面的那个将继续保留原始的height:200。
Javascript 相关文章推荐
IE与Firefox下javascript getyear年份的兼容性写法
Dec 20 Javascript
JQuery操作表格(隔行着色,高亮显示,筛选数据)
Feb 23 Javascript
jquery toolbar与网页浮动工具条具体实现代码
Jan 12 Javascript
jquery JSON的解析方式示例介绍
Jul 27 Javascript
JavaScript使用Replace进行字符串替换的方法
Apr 14 Javascript
jQuery实现的进度条效果
Jul 15 Javascript
jQuery UI插件实现百度提词器效果
Nov 21 Javascript
AngularJS中table表格基本操作示例
Oct 10 Javascript
vue+axios+element ui 实现全局loading加载示例
Sep 11 Javascript
es6函数之严格模式用法实例分析
Mar 17 Javascript
在vue项目中 实现定义全局变量 全局函数操作
Oct 26 Javascript
jQuery列表动态增加和删除的实现方法
Nov 05 jQuery
jQuery timers计时器简单应用说明
Oct 28 #Javascript
jquery ajax abort()的使用方法
Oct 28 #Javascript
BOM与DOM的区别分析
Oct 26 #Javascript
js下判断 iframe 是否加载完成的完美方法
Oct 26 #Javascript
Javascript下判断是否为闰年的Datetime包
Oct 26 #Javascript
基于jquery的给文章加入关键字链接
Oct 26 #Javascript
EasyUi tabs的高度与宽度根据IE窗口的变化自适应代码
Oct 26 #Javascript
You might like
php 连接mysql连接被重置的解决方法
2011/02/15 PHP
将博客园(cnblogs.com)数据导入到wordpress的代码
2013/01/06 PHP
推荐一本PHP程序猿都应该拜读的书
2014/12/31 PHP
PHP实现将多个文件中的内容合并为新文件的方法示例
2017/06/10 PHP
YII2框架中使用RBAC对模块,控制器,方法的权限控制及规则的使用示例
2020/03/18 PHP
IE 缓存策略的BUG的解决方法
2007/07/21 Javascript
JS 继承实例分析
2008/11/04 Javascript
JQuery下的Live方法和$.browser方法使用代码
2010/06/02 Javascript
javascript学习笔记(三) String 字符串类型介绍
2012/06/19 Javascript
js弹出模式对话框,并接收回传值的方法
2013/03/12 Javascript
javascript实现控制div颜色
2015/07/07 Javascript
IE6兼容透明背景图片及解决方案
2015/08/19 Javascript
JS实现支持Ajax验证的表单插件
2016/03/24 Javascript
Bootstrap自定义文件上传下载样式
2016/05/26 Javascript
jQuery元素选择器实例代码
2017/02/06 Javascript
js鼠标经过tab选项卡时实现切换延迟
2017/03/24 Javascript
深入理解angular2启动项目步骤
2017/07/15 Javascript
label+input实现按钮开关切换效果的实例
2017/08/16 Javascript
微信小程序支付之c#后台实现方法
2017/10/19 Javascript
React 组件转 Vue 组件的命令写法
2018/02/28 Javascript
JS表单传值和URL编码转换
2018/03/03 Javascript
微信小程序实现签到功能
2018/10/31 Javascript
微信小程序地图导航功能实现完整源代码附效果图(推荐)
2019/04/28 Javascript
vue elementui 实现搜索栏公共组件封装的实例代码
2020/01/20 Javascript
vscode自定义vue模板的实现
2021/01/27 Vue.js
[02:54]DOTA2亚洲邀请赛 VG战队出场宣传片
2015/02/07 DOTA
利用Python脚本生成sitemap.xml的实现方法
2017/01/31 Python
Python版名片管理系统
2018/11/30 Python
基于Python3读写INI配置文件过程解析
2020/07/23 Python
Python用来做Web开发的优势有哪些
2020/08/05 Python
使用HTML5里的classList操作CSS类
2016/06/28 HTML / CSS
为什么会有内存对齐
2016/10/10 面试题
职业生涯规划书的格式
2013/12/29 职场文书
酒店行政人事部经理职务说明书
2014/02/26 职场文书
学习实践科学发展观心得体会
2014/09/10 职场文书
Vue如何清空对象
2022/03/03 Vue.js