有人可以帮助解释这个jQuery代码吗？

$('#AddMoreErrors,#AddMoreMime,#AddMoreRemote').live('click',function(){ 
    var newRow = $(this).closest('tr'); 
    $(this).closest('tr').after('<tr class="'+newRow.attr('class')+'">'+newRow.html()+'</tr>').find('span').removeAttr('id').addClass('removetr').html('Del');     
});

上面我写的jQuery代码，这就是它的作用：当有人点击“添加更多”找到最近的tr，它复制到另一个tr并追加到第一个。然后找到所有span，删除其id并添加新的class并更改文本。有人可以帮助解释这个jQuery代码吗？

现在让我感到震惊find('span').removeAttr('id').addClass('removetr').html('Del');

我知道我可以在span做removeAttr但怎么也addClass和html也得到上span应用？

来源

2011-08-30 aWebDeveloper

等等...所以你根本不知道你在写什么**。 – BoltClock

我有其他的想法，并认为这可能工作，但是当它在第一枪的工作，我很惊讶 – aWebDeveloper

噢好吧，那很好。 – BoltClock

jQuery在执行它的每个操作之后返回元素的对象，执行顺序从左到右。因此它的.removeAttr('id')将在跨度上，并且该跨度对象将被返回。同样执行.addClass('removetr')和.html('Del');。

来源

2011-08-30 06:08:49 Vins

这被称为方法链。每种jQuery方法（removeAttr(),addClass(),html(val)）都会返回它所属的jQuery对象。这意味着你可以使用点符号来调用更多的方法。

来源

2011-08-30 05:56:58 Phil

我知道我为什么使用它的链，但是如何将所有3应用在span上 – aWebDeveloper

@WebDeveloper Quentin比我在[他们的答案]中解释得更好（http://stackoverflow.com/questions/7239190/can-some -one-explain-the-below-jquery-code/7239221＃7239221） – Phil

大多数jQuery方法返回this，所以：

find('span').removeAttr('id').addClass('removetr').html('Del');

意思是一样的：

var foo = find('span'); 
foo.removeAttr('id'); 
foo.addClass('removetr') 
foo.html('Del');

来源

2011-08-30 05:57:09 Quentin

你的意思是什么？我明白他们都是一样的（我的和我的）。但你能给我一些矿石的详细信息 – aWebDeveloper

'foo.removeAttr（'id'）'的返回值是'foo' – Quentin

哦好吧所以所有的方法返回foo – aWebDeveloper

我不知道你问什么，但如果你想知道你为什么可以连续链接jQuery命令，这是因为每个jQuery函数都返回“this”。与IIFEs时，您可以轻松地做同样的：

function doSth() { 
    // Some logic 
    return this; 
}

居然会发生什么，是你们每个方法调用后返回的对象，并继续从之前调用的方法对同一对象的工作。

这意味着，

$("#sel").method().method2().method3();

是完全一样的书写

var sel = $("sel"); 
sel.method(); 
sel.method2(); 
sel.method3();

只有它的短，看起来更好，你不需要变量保存的情况下，你不之后需要它。

这样，您可以编写一个接一个的函数，并且在函数执行后您将始终拥有完整的jQuery函数。

所以你也看到，为什么这三种方法都是在同一个对象上执行的：这就是链接工作的方式。通过调用“$”你创建一个新的对象。然后所有方法都在该对象上执行。

除非当然函数实际返回一个值。然后，这不起作用。

function getSth() { 
    return "value"; 
}

来源

2011-08-30 05:57:29

有人可以帮助解释这个jQuery代码吗？

回答

相关问题