본문 바로가기

내마음대로만들어보자/JS83

each() / $.each() 메서드 선택자로 선택한 요소(문서 객체)는 배열에 순서대로 저장된다. 이때 배열에 저장된 요소를 순서대로 하나씩 선택하면서 인덱스 정보를 가져온다. * 기본형 1. $("요소 선택").each(funciton(매개변수1, 매개변수2) {}) 2. $.each($("요소 선택"), funciton(매개변수1, 매개변수2) {}) 3. $("요소 선택").each(function(){ $(this) }) 4. $.each($("요소 선택"), function() {$(this) }) 1,2 배열에 저장된 요소의 개수만큼 메서드를 반복 실행한다. 메서드를 실행할 때마다 매개변수1, 매개변수2에는 배열에 저장된 요소와 인덱스의 값이 배열에 오름차순으로 대입된다. 3,4 배열에 저장된 요소의 개수만큼 매서드를 반복실핸다.. 2021. 8. 18.
only-child / slice(index) 선택자 only-child 선택자는 선택한 요소가 "부모 요소에게 하나 뿐인 자식요소"인 경우에 선택한다. slice(index)선택자는 선택한 요소의 지정 구간 인덱스의 요소를 선택한다. 예를들어, slice(1,3) 1초과 3이하의 요소를 선택한다는 의미 * 예제 탐색 선택자 내용1-1 내용1-2 내용1-3 내용1-4 내용2-1 2021. 8. 18.
nth-child(숫자n) / nth-last-child(숫자) 선택자 nth-child(숫자) 는 선택한 요소 중 지정한 숫자에 위치한 요소를 선택한다. nth-child(숫자n) 선택한 요소 중 지정한 배수에 위치한 요소를 선택한다. nth-last-child(숫자) 선택 한 요소 중 마지막 위치에서 지정한 숫자에 위치한 요소를 선택한다. * 예제 탐색 선택자 내용1-1 내용1-2 내용1-3 내용1-4 내용2-1 내용2-2 내용2-3 2021. 8. 18.
first-of-type / last-of-type 선택자 first-of-type 선택자는 선택한 요소의 무리 중 첫 번째 요소만 선택한다. 이와 반대로 last-of-type 선택자는 선택한 요소의 무리 중 마지막에 위치한 요소만 선택한다. * 기본형 $("요소 선택:first-of-type") $("요소 선택:last-of-type") * 예제 탐색 선택자 내용1-1 내용1-2 내용1-3 내용2-1 내용2-2 내용2-3 위 예제에서는 2개의 태그가 있고, 그 안의 모든 태그를 선택할 경우 2개의 태그 무리가 나타난다. 이떄 first-of-type , last-of-type 선택자를 사용하면 두 무리에서 첫번쨰에 위치한 태그, 그리고 마지막에 위치한 태그가 선택된다. 2021. 8. 18.