我开始一个项目与jQuery。

在你的jQuery项目中有哪些陷阱/错误/误解/滥用/误用?


当前回答

使用字符串累加器样式

使用+运算符在内存中创建一个新的字符串,并将连接的值赋给它。只有在此之后,结果才被赋值给一个变量。 为了避免连接结果的中间变量,可以使用+=运算符直接分配结果。 慢:

a += 'x' + 'y';

速度:

a += 'x';
a += 'y';

基元操作可能比函数调用快

考虑在性能关键循环和函数中使用替代基元操作而不是函数调用。 慢:

var min = Math.min(a, b);
arr.push(val);

速度:

var min = a < b ? a : b;
arr[arr.length] = val;

请参阅JavaScript性能最佳实践

其他回答

过度使用链条。

看到这个:

this.buttonNext[n ? 'bind' : 'unbind'](this.options.buttonNextEvent, this.funcNext)[n ? 'removeClass' : 'addClass'](this.className('jcarousel-next-disabled')).attr('disabled', n ? false : true);

解释

不要使用裸类选择器,像这样:

$('.button').click(function() { /* do something */ });

这将检查每一个元素,看它是否有一个“button”类。

相反,你可以帮助它,比如:

$('span.button').click(function() { /* do something */ });
$('#userform .button').click(function() { /* do something */ });

这是我去年从Rebecca Murphy的博客中学到的

更新:这个答案是2年前给出的,不适合当前版本的jQuery。 其中一个评论包括一个测试来证明这一点。 还有一个更新的测试版本,其中包含了回答这个问题时的jQuery版本。

事件

$("selector").html($("another-selector").html());

不会克隆任何事件-你必须重新绑定它们。

根据JP的评论- clone()如果您传递true,则会重新绑定事件。

将id而不是jQuery对象传递给函数:

myFunc = function(id) { // wrong!
    var selector = $("#" + id);
    selector.doStuff();
}

myFunc("someId");

传递一个包装集要灵活得多:

myFunc = function(elements) {
    elements.doStuff();
}

myFunc($("#someId")); // or myFunc($(".someClass")); etc.

不理解事件绑定。JavaScript和jQuery的工作方式不同。

根据大众需求,一个例子:

jQuery:

$("#someLink").click(function(){//do something});

没有jQuery:

<a id="someLink" href="page.html" onClick="SomeClickFunction(this)">Link</a>
<script type="text/javascript">
SomeClickFunction(item){
    //do something
}
</script>

基本上JavaScript所需要的钩子不再是必要的。例如,使用内联标记(onClick等),因为您可以简单地使用开发人员通常用于CSS目的的ID和类。