为什么$ .add()不按预期工作？尝试手动构建jQuery集合

Question

我不明白为什么以下代码不起作用.(jQuery 1.6.4)

HTML:

<div class="test"></div>
<div class="test"></div>
<div class="test"></div>
<div class="test"></div>
<div class="test"></div>
<div class="test me"></div>
<div class="test me"></div>
<div class="test me"></div>

JS:

var rows = $([]);

console.debug('Divs we want: ', $('div:not(.me)').length);

console.debug('Rows before: ', rows.length);

$('div:not(.me)').each(function() {
    if (1==1) { // some conditional
        console.debug($(this));
        rows.add($(this));
    }
});

console.debug('Rows after: ', rows.length);

Answer 1

add()构建并从它所调用的内容和你提供的参数中返回一个新的jQuery对象.它不会更新它所调用的对象.

你可能想写:

rows = rows.add(this);

顺便说一下,从jQuery 1.4开始,构造空jQuery对象的规范方法是$()不带参数调用:

var rows = $();

Answer 2

原因是add返回带有添加元素的新jQuery对象.它不会内联修改现有的jQuery对象.您需要捕获此结果.更改

rows.add($(this));

至

rows = rows.add($(this));

注意:正如Rocket指出的那样,删除额外的对象并简单地说它更简单

rows = rows.add(this);