# nextElementSibling

ssonnni

01.부모,조상 요소 찾기 parentElement : 부모요소 찾기 , 태그만 찾음 closest : 현재 엘레멘트에서 가장 가까운 조상요소 찾기 , 없다면 null 반환 > ### 02.자식,자손 요소 찾기 children : 자식요소 찾기 , 불필요한 요소를 제거하고 하위element만 조회 childNodes : 자식요소 찾기 , 지정된 요소의텍스트와 하위 element를 모두 조회, 심지어 코드 줄맞춤을 위한 줄바꿈도 텍스트로 인식 (비추) 메서드체인: 자손요소 찾기,객체로 가져온 HTMLElement는 그 하위의 요소들을 다시 getElementBy .., querySelector 등의 기능으로 탐색할 수 있다. * document 안붙이고 가져온 객체 변수명에 바로 요소에 접근한다.* > ### 03.이전,다음 요소 찾기 previousElementSibling : 이전요소 찾기

cptkuk91

DOM? Document Object Model (문서 객체 모델) 실제 Body 안쪽 html 요소들을 script로 제어하는 기능 DOM 제어는 상당히 중요하다. 원하는 곳을 직접 제어하기 위해서.. JS를 연결하는 방법은 다양하지만 가장 순수한 JS 연결법은.. 모든 예시는 위 코드를 바탕으로 생각하고, body가 최상위 요소다. 자식 요소 탐색 방법은 다양하다. 직접 querySelector()를 통해서 선택하는 방법 부모요소.children을 통한 선택 형제 요소 탐색 이전 형제요소 탐색: 형제요소.previousElementSibling 다음 형제요소 탐색: 형제요소.nextElementSibling 부모 요소 탐색 현재요소.parentElement 현재요소.closet() ex) 직접적으로 wrap 을 찾는 방법 ex) wrap을 기준으로 box2를 찾는 방법 ex) chi

kychoi123

test.html

unu

.gif) 인스타그램의 로그인 페이지 오늘은 인스타그램 로그인 페이지의 이미지 크로스페이드를 따라해보려한다. 시행착오를 많이 겪었다. 방법 1 클래스를 붙였다 떼는 방식 유튜브에 검색해서 따라했는데, 출처를 확인할 수가 없다.. 문제: 이미지 하나하나의 페이드만 되고 크로스페이드가 안된다. 방법 2 배열api를 이용해서 이미지 순환시키기 .gif) 문제: 이미지 순환의 문제는 없

mnmm

index.html 참고로 마지막 new div는 javascript로 구현한 것!