나중에 사용하기 위해 변수에 HTML 요소 컬렉션 저장

Question

여기 jQuery 문제가 있는데, 나는 항상 자랑스럽지 않은 방법으로 해결해야합니다.

나중에 평가할 수 있도록 요소 모음을 저장하려고합니다. 문제는 모든 함수에 액세스하여 적용하려고 할 때마다 오류 콘솔이 함수가 아니라고보고한다는 것입니다. jQuery의 작동 방식에 대한 오해가 있음을 확신합니다. 그럼에도 불구하고 올바른 방향으로 지적하고 싶습니다. 여기

var products = $('ul.products'); 
var productLists = [] 
$.each(products, function (i) { 
    productLists[i] = products[i].children('li'); 
    console.log(productLists[i]); 
}); 

와 내가 오류입니다 : 당신이는 HTMLElement를 JQuery와 방법을 호출하려고 시도하고

Uncaught TypeError: Property 'children' of object #<HTMLUListElement> is not a function 

Answer 1

여기에 내가 사용하고있는 코드입니다. 새로운 jQuery를 오브젝트의 요소 참조를 포장하십시오 :

productLists[i] = $(products[i]).children('li'); 

$.each 내에서 현재 항목이 처리되는 참조하는 키워드 this를 사용할 수 있습니다. 대신 products[i]를 호출 그래서, 당신은 쉽게 this 말할 수 :

$.each(products, function() { 
    productsList.push($(this).children("li")); 
}); 

참고 또한 당신이 선택 할 때 jQuery를 이미 요소에 대한 참조의 컬렉션을 저장하는 :

var productList = $("ul.products li"); // All list items in ul.products 

그런 다음 조작 할 수 있습니다 이 모든 것은 나중에 원하는대로 할 수 있습니다. 당신이 그들의 자신의 사본을해야하는 경우 .clone을 사용할 수 있습니다, 당신이 그 (것)들로 변조 할 때 나중에 존재하게됩니다 보장 : 직접 JQuery와 컬렉션 개체에 각각의 방법을 사용할 수 있습니다

var productList = $("ul.products li").clone(); 

Answer 2

. 그래서 같은 일을하고있는 또 다른 방법이 될 수있다 : jQuery를 수집 다룰 때 선택의

$('ul.products').each(function(){ 
    productsList.push($(this).children("li")); 
}) 

물질하지만, 난 항상이 방법을 선호했다.