// 不好的 (如果列表里面元素很多)
$('li.trigger').click(handlerFn);
// 较好的: event delegation with $.fn.live
$('li.trigger').live('click', handlerFn);
// 最优的: $.fn.delegate
$('#myList').delegate('li.trigger', 'click', handlerFn);
移除元素
DOM操作是慢的，你应该尽量避免去操作它。jQuery在1.4版引入了
$.fn.detach从DOM中去掉所有匹配的元素。
复制代码 代码如下:
var $table = $('#myTable');
var $parent = table.parent();
$table.detach();
// ... 添加大量的行到表格中
$parent.append(table);
.detach()和.remove()一样, 除了.detach()保存所有jQuery数据和被移走的元素相关联。当需要移走一个元素，不久又将该元素插入DOM时，这种方法很有用。
当大量元素修改CSS，应该使用样式表
如果你在用$.fn.css给多于20个元素修改CSS，考虑一下添加一个style标签，这样可以速度可以提升60 % 。
复制代码 代码如下:
// 多于20个 明显慢
$('a.swedberg').css('color', '#asd123');
$('<style type="text/css">a.swedberg { color : #asd123 }</style>').appendTo('head');
使用$.data而不是$.fn.data将$.data应用于DOM元素比直接调用jQuery选择结果的$.fn.data要快上10倍.虽然，这要先确定你是理解DOM元素与jQuery选择结果之间的区别的。
复制代码 代码如下:
// 常用
$(elem).data(key, value);
// 快十倍
$.data(elem, key, value);
别费时间在空白的选择结果上了
jQuery将不会告诉你，如果你想运行的代码在一个空选择上，它会继续运行，好像没有什么错。影响性能。
复制代码 代码如下:
//太遭了，执行了三个方法后才意识到里面是空的
$('#nosuchthing').slideUp();
// 较好
var $mySelection = $('#nosuchthing');
if ($mySelection.length) {
mySelection.slideUp();
}
// 最佳: add a doOnce plugin
jQuery.fn.doOnce = function(func) {
this.length && func.apply(this);
return this;
}
$('li.cartitems').doOnce(function() {
// make it ajax! \o/
});这层保护是适用于jQuery UI widget，因为即使操作的元素为空其开销也不少。
定义变量
变量可以定义一个声明而不是几个
复制代码 代码如下:
// 老套写法
var test = 1;
var test2 = function() {...
};
var test3 = test2(test);
// 新
var test = 1,
test2 = function() {...
},
test3 = test2(test);在自动执行的函数，变量的定义可以完全省掉。 (function(foo, bar) {...
})(1, 2);
条件判断
复制代码 代码如下:
// 旧方法
if (type == 'foo' || type == 'bar') {...
}
// 好方法
if (/^(foo|bar)$/.test(type)) {...
}
// 查找对象
if (({
foo: 1,
bar: 1
})[type]) {...
}