// 当元素少于 20 个时使用这个方法，多余 20 个时，速度就慢了 $('a.swedberg').css('color', '#asd123'); // 多余 20 个元素时，应考虑直接在页面中添加 style 标签 $('<style type="text/css">a.swedberg { color : #asd123 }</style>') .appendTo('head');
使用 $.data 替代 $.fn.data
将 $.data 应用于 DOM 元素上，比直接在选择器上调用 $.fn.data 要快 10 倍。当然，前提是要先明白 DOM 元素和 jQuery 结果集之间的区别。
// 速度一般 $(elem).data(key,value); // 速度提升 10 倍 $.data(elem,key,value);
别在空元素上浪费时间
jQuery 不会主动告诉你，你正在一个空白的结果集上运行代码 – 而且执行过程中并未出错。所以有时候再执行代码之前，需要先判断一下结果集是否为空：
// 不好：执行了三个函数之后 // 才发现结果集上没有任何元素 $('#nosuchthing').slideUp(); // 好 var $mySelection = $('#nosuchthing'); if ($mySelection.length) { $mySelection.slideUp(); } // 最好：增加一个 doOnce 插件 jQuery.fn.doOnce = function(func){ this.length && func.apply(this); return this; } $('li.cartitems').doOnce(function(){ // 这里可以确保结果集不是空的 });
这种方法特别适用于 jQuery UI 方面，因为即使结果集中不包含任何元素，其开销也会很大。
变量的定义
可以在一条语句中定义多个变量：
// 老掉牙的写法 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]) { ... }
您可能感兴趣的文章: