爲什麼用.each（）迭代jQuery對象不給我jQuery對象？

Question

預期以下工作：

$(".foo").first().text("hi!") 

...因爲first()返回一個jQuery對象。

但是，如果我想對所有比賽的text()方法來工作，我需要做的：

$(".foo").each(function(idx, obj) { 
    $(obj).text("hi!") 
    } 
) 

...因爲each()給你D​​OM對象。

這個令人困惑的區別背後的設計原因是什麼？我該如何避免爲每個匹配構建一個jQuery對象？

Answer 1

可能由於涉及到遍歷大集合性能方面的原因？如果您只需要DOM對象，則可以節省週期。如果你需要jQuery對象，那麼你可以很容易地得到它。

我通常不會爲每個參數提供第二個參數，所以我可以使用$（this）。

Answer 2

你看到.each VS jQuery.each

你應該能夠做到以下幾點：

$('li').each(function(index) { 
    alert(index + ': ' + $(this).text()); 
}); 

％的第一個鏈接。嘗試$(this)代替$(obj)

Answer 3

嘗試

$(".foo").each(function(idx, obj) { 
    $(this).text("hi!") 
    } 
) 

Answer 4

我相信，由於jQuery使用包裝對象，第一個方法使用原始包裝，並只刪除包裝中的第一個元素，從而保持它爲jQuery對象。

但是，如果他們爲每個節點提供了一個jQuery對象，那麼它們會產生爲每個節點創建包裝的開銷。由於你不一定需要這個包裝器對象，它會產生不必要的開銷。

Answer 5

內部的jQuery調用此爲$("sel").each(function(){});

if (isObj) { 
    for (name in object) { 
     if (callback.call(object[ name ], name, object[ name ]) === false) { 
      break; 
     } 
    } 
} 

而且eq是一個簡單的切片：

eq: function(i) { 
    return i === -1 ? 
    this.slice(i) : 
    this.slice(i, +i + 1); 
} 

所以，你可以創建一個新的each函數，而不是object[name]，會做一個object:eq(i)

$("*").slice(1,2).toSource() == $("*").eq(1).toSource(); 

所以要創建自己的each：

$.fn.each2 = function(callback) 
{ 
    for (var i = 0; i < this.length; ++i) { 
     callback.call(this.eq(i), i, this.eq(i)) 
    } 
}; 

$("*").each2(function(i, obj) { 
    alert(obj); // now obj is a jQuery object 
}); 

---

似乎each3快於each2http://www.jsfiddle.net/m7pKk/2/

$.fn.each2 = function(callback) 
{ 
    for (var i = 0; i < this.length; ++i) { 
     var jObj = this.eq(i); 
     callback.call(jObj, i, jObj) 
    } 
}; 

$.fn.each3 = function(callback) 
{ 
    for (var i = 0; i < this.length; ++i) { 
     var jObj = $(this[i]); 
     callback.call(jObj, i, jObj) 
    } 
}; 

See this example on jsFiddle with performance measurement.

Answer 6

有明顯的性能損失，這將是採取每次迭代。每次迭代創建一個新的jQuery對象比較大的集合要慢得多並且可能很明顯。通常，您不需要包裝對象的附加便利，特別是在訪問單個屬性或屬性時。您經常會看到像$(this).is(":checked")這樣的週期浪費代碼，而不是this.checked。

除此之外，我會說這是因爲它有意義。一個jQuery對象通常代表可以是任何數量的DOM對象的集合。有時候，jQuery純粹用於選擇器支持和事件綁定，並沒有太多。迭代包含單個元素的集合時，迭代多個元素的集合時沒有多大意義。返回更可能需要的單個項目（DOM元素）會更有意義，如果您需要添加的功能，則可以使用jQuery來包裝它。這也保持了對NodeList和其他類型集合的迭代。

Answer 7

可能是因爲在你的例子中沒有理由甚至使用each。相反的：

$(".foo").each(function(idx, obj) { 
    $(obj).text("hi!"); 
) 

只需使用：使用jQuery集時

$(".foo").text("hi!"); 

一切都是自動複數。