인프런 커뮤니티 질문&답변
작성자 없음
작성자 정보가 삭제된 글입니다.
<html css js를 활용한 반응형 모던 웹페이지 만들기 3> 강의 영상 중 질문입니다.
작성
·
398
0
<html css js를 활용한 반응형 모던 웹페이지 만들기 3> 강의 영상 중 질문입니다.
const slidePreviewList = document.getElementsByClassName("slide-prev"); 로 상수를 선언하시고
그후 for문에서
for (let i = 0; i < slidePreviewList.length; i++) {
let classList =
slidePreviewList[i].parentElement.parentElement.nextElementSibling;
let liList = classList.getElementsByTagName("li"); ...~}
여기서 slidePreviewList[i]는 어떤걸 지칭하는건가요?
slidePreviewList[1]은 slide-prev라는 클래스 이름을 가지는 첫번재 요소를 가리키고
slidePreviewList[2]는 slide-prev라는 클레스 이름을 가지는 그다음 요소를 가리키는 방식인가요?
좋은강의 항상 감사합니다.
답변 1
0
잔재미코딩 DaveLee
지식공유자
안녕하세요. 답변도우미입니다.
말씀하신 코드가 다음 코드를 이야기하시는 것 맞죠?
해당 코드에서 첫 줄에 slidePrevList 는 전체 HTML 코드에서 slide-prev 클래스를 모두 배열로 가져옵니다. 즉, 여러 강의 리스트가 여러 행에 있을 때, 각 행에 있는 < 화살표 표시를 가져와서요. 말씀하신대로, 첫번째 행의 요소는 slidePrevList[0] 이 되고, slidePrevList[1] 은 두번째 행의 요소를 가리키게 됩니다.
const slidePrevList = document.getElementsByClassName('slide-prev');
for (let i = 0; i < slidePrevList.length; i++) {
// ul 태그 선택
let classList = slidePrevList[i].parentElement.parentElement.nextElementSibling;
let liList = classList.getElementsByTagName('li');
조금 복잡하실 수 있어요. 반복해서 해당 부분을 설명한 영상을 들으시면서, console.log 로 출력해보시거나, 디버그 포인트를 잡으셔서, 해당 객체의 세부 데이터를 확인해보시면 조금씩 더 익숙해지실꺼예요.
감사합니다.