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 相关文章推荐
js左侧三级菜单导航实例代码
Sep 13 Javascript
JS实现简单的顶部定时关闭层效果
Jun 15 Javascript
面向切面编程(AOP)的理解
May 01 Javascript
js+css实现超简洁的二级下拉菜单效果代码
Sep 07 Javascript
实例讲解JavaScript中call、apply、bind方法的异同
Sep 13 Javascript
解决AjaxFileupload 上传时会出现连接重置的问题
Jul 07 Javascript
Vue绑定内联样式问题
Oct 17 Javascript
微信小程序如何调用json数据接口并解析
Jun 29 Javascript
微信小程序 冒泡事件原理解析
Sep 27 Javascript
vue与django集成打包的实现方法
Nov 11 Javascript
小程序跳转到的H5页面再跳转回跳小程序的方法
Mar 06 Javascript
使用 UniApp 实现小程序的微信登录功能
Jun 09 Javascript
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
2006/10/09 PHP
PHP实现支持加盐的图片加密解密
2016/09/09 PHP
js使下拉列表框可编辑不止是选择
2013/12/12 Javascript
HTML+CSS+JS实现完美兼容各大浏览器的TABLE固定列
2015/04/26 Javascript
js检测iframe是否加载完成的方法
2015/11/26 Javascript
鼠标悬停小图标显示大图标
2016/01/22 Javascript
Bootstrap的Refresh Icon也spin起来
2016/07/13 Javascript
jQuery鼠标事件总结
2016/10/13 Javascript
微信小程序图片选择、上传到服务器、预览(PHP)实现实例
2017/05/11 Javascript
基于jQuery实现图片推拉门动画效果的两种方法
2017/08/26 jQuery
解决Angular2 router.navigate刷新页面的问题
2018/08/31 Javascript
VUE预渲染及遇到的坑
2018/09/03 Javascript
nodejs同步调用获取mysql数据时遇到的大坑
2019/03/02 NodeJs
浅谈Webpack多页应用HMR卡住问题
2019/04/24 Javascript
Element ui 下拉多选时新增一个选择所有的选项
2019/08/21 Javascript
在vue中使用jsx语法的使用方法
2019/09/30 Javascript
小程序input数据双向绑定实现方法
2019/10/17 Javascript
vue项目中企业微信使用js-sdk时config和agentConfig配置方式详解
2020/12/15 Vue.js
[06:45]2018DOTA2亚洲邀请赛 4.5 SOLO赛 Sccc vs Maybe
2018/04/06 DOTA
在Python的Tornado框架中实现简单的在线代理的教程
2015/05/02 Python
python实现读取命令行参数的方法
2015/05/22 Python
轻松理解Python 中的 descriptor
2017/09/15 Python
Python中的Numpy矩阵操作
2018/08/12 Python
对python中的乘法dot和对应分量相乘multiply详解
2018/11/14 Python
Python多进程入门、分布式进程数据共享实例详解
2019/06/03 Python
基于树莓派的语音对话机器人
2019/06/17 Python
Pycharm保存不能自动同步到远程服务器的解决方法
2019/06/27 Python
python之MSE、MAE、RMSE的使用
2020/02/24 Python
python利用proxybroker构建爬虫免费IP代理池的实现
2021/02/21 Python
递归实现回文判断(如:abcdedbca就是回文,判断一个面试者对递归理解的简单程序)
2013/04/28 面试题
渔夫的故事教学反思
2014/02/14 职场文书
毕业证明模板
2015/06/19 职场文书
环保建议书范文
2015/09/14 职场文书
javaScript Array api梳理
2021/03/31 Javascript
使用这 6个Vue加载动画库来减少我们网站的跳出率
2021/05/18 Vue.js
详解MySQL中的pid与socket
2021/06/15 MySQL