Notice
Recent Posts
Recent Comments
Link
SeouliteLab
jQuery를 사용한 리스트 아이템의 데이터 매핑하기 본문
jQuery의 map()
메서드는 선택한 요소 집합에 대해 함수를 실행하여 새로운 배열을 반환하는 데 사용됩니다. 이를 활용하여 리스트 아이템에 대한 데이터를 매핑하고 조작할 수 있습니다. 아래 예제를 통해 map()
메서드를 사용하여 리스트 아이템의 데이터를 매핑하는 방법을 알아보겠습니다.
예제 1: 리스트 아이템의 텍스트를 배열로 매핑하기
var listItemTexts = $("li").map(function() {
return $(this).text();
}).get();
console.log(listItemTexts);
이 예제는 페이지에서 모든 리스트 아이템의 텍스트를 가져와 배열로 매핑합니다. 그리고 이 배열을 콘솔에 출력합니다.
예제 2: 리스트 아이템의 길이를 배열로 매핑하기
var listItemLengths = $("li").map(function() {
return $(this).text().length;
}).get();
console.log(listItemLengths);
이 예제는 페이지에서 모든 리스트 아이템의 텍스트 길이를 가져와 배열로 매핑합니다. 그리고 이 배열을 콘솔에 출력합니다.
예제 3: 리스트 아이템의 순서를 배열로 매핑하기
var listItemIndexes = $("li").map(function(index) {
return index + 1;
}).get();
console.log(listItemIndexes);
이 예제는 페이지에서 모든 리스트 아이템의 순서를 가져와 배열로 매핑합니다. 그리고 이 배열을 콘솔에 출력합니다.
'프로그래밍' 카테고리의 다른 글
jQuery를 사용한 선택한 요소 이후의 모든 형제 요소 선택하기 (0) | 2024.04.15 |
---|---|
jQuery를 사용한 다음 형제 요소 선택하기 (0) | 2024.04.15 |
jQuery를 사용한 마지막 리스트 아이템 선택하기 (0) | 2024.04.15 |
jQuery를 사용한 리스트 클릭 시 아이템 배경색 변경하기 (0) | 2024.04.15 |
jQuery를 사용한 하위에 리스트를 포함한 리스트 아이템 선택하기 (0) | 2024.04.15 |