JavaScript - DOM 선택자 2
부묘 요소 접근el.closest()요소 간 상하좌우 관계 접근el.parentElement, el.children, el.firstElementChild, el.lastElementChild, el.nextElementSibling, el.previousElementSibling문서 내 주요 DOM 요소 접근document.documentElement, document.body, document.head문서 내 특정 태그 목록 접근document.forms, document.images, document.links, document.scripts일반 / Shadow DOM 루트 접근generalEl.getRootNode(), shadowEl.getRootNode()Shadow DOM 이란?목표다양한 D..
JavaScript - DOM 선택자 1
DOM 이란?DOM 주요 선택자 getElementById, getElementsByClassName, getElementsByTagName, getElementsByName, querySelector, querySelectorAllHTML Collection vs NodeList 차이점예제코드목표웹 페이지에서 JavaScript를 통해 HTML 요소를 선택하는 방법은 다양하며, 상황에 따라 적절한 선택자를 사용하는 것이 중요하다. 자주 사용되는 DOM 선택자들을 살펴보자키워드getElementById, getElementsByClassName, getElementsByTagName, getElementsByName, querySelector, querySelectorAll HTML Collection,..
JavaScript 배열 메서드
JavaScript 배열 메서드배열 추가/삭제 메서드unshift(), shift(), push(), pop(), splice(), slice()배열 검색 메서드indexOf(), includes(), find(), findIndex()배열 변형/변환 메서드concat(), join(), reverse(), sort()배열 반복 메서드forEach(), map(), filter(), reduce()배열 조건 검사 메서드some(), every()NEW 키워드배열 메서드, 콜백함수# JavaScript 배열 메서드배열을 다루는 여러 가지 기능을 제공하는 JS 내장 함수사용 범위데이터 처리 : API 로부터 받은 데이터 배열 가공UI 렌더링 : 리스트를 렌더링할 때 데이터를 변형하거나 필터링하여 화면에 표시..