爲什麼.detach（）在DOM元素數組中拋出錯誤？

我想知道爲什麼我得到錯誤「$ groceryItems [i] .detach不是一個函數」，當我能夠看到$ groceryItems [i]確實是一個DOM元素的記錄結果？爲什麼.detach（）在DOM元素數組中拋出錯誤？

我只包括腳本而不是ejs視圖。

<script> 
function sortByAvgRating() { 

var $groceryItems = $('.groceryItems');//grab all of the grocery items 

for (var i = $groceryItems.length; i--;) {//detach each grocery item from the DOM 
    console.log('$groceryItems[i] ', $groceryItems[i]); 
    $groceryItems[i].detach(); 
} 

$groceryItems.sort(function(a, b) {//sort the grocery items by the rating attribute 
    return +a.children[1].children[0].children[0].dataset.rating - 
     +b.children[1].children[0].children[0].dataset.rating; 
}). 
appendTo('groceryItemsContainer');//apppend the sorted array of elements to the DOM 
} 

</script>

來源

2017-05-08 Eric

因爲......它不是一個函數一個DOM節點。 –

@ibrahim mahir的答案解釋了爲什麼你的代碼不起作用。

但是你不需要編寫一個循環來分離jQuery對象中的所有元素。將jQuery修改函數應用於集合時，它會自動在所有元素上執行它。

所以，你可以簡單的寫：

$groceryItems.detach();

當你要遍歷集合中的元素，使用.each()：

$groceryItems.each(function() { 
    console.log(this); 
    $(this).detach(); 
});

來源

2017-05-08 21:39:27 Barmar

爲什麼你用'each'來迭代一個集合？我一直很想知道這實際上。它不會讓你立即訪問jQuery包裹的元素，就像你期望的那樣，參數的順序不同於本地的'forEach'，它是愚蠢的，但是無論如何。我沒有得到有用的東西。 – 1252748

@ 1252748對於早期的瀏覽器來說，這些瀏覽器可能不會實現標準的JavaScript循環結構（例如IE8沒有'forEach'），所以它是一個有用的墊片。現在我只是爲了保持一致性 - 如果我使用jQuery，我堅持使用它的方法。 – Barmar

$groceryItems是具有在其上定義的函數detach jQuery對象，但$groceryItems[i]是索引i在原始DOM元素。 DOM元素不具有稱爲detach的功能。

裹在一個jQuery對象中的元素調用detach前：

$($groceryItems[i]).detach();

或者使用eq代替[]（eq將返回已detach上定義一個jQuery對象）：

$groceryItems.eq(i).detach(); 
//   ^^^^^^

來源

2017-05-08 21:34:53

爲什麼.detach（）在DOM元素數組中拋出錯誤？

回答

相關問題