Front-end/Vanilla JS(2)
-
[jQuery to Vanilla JS] 2. jQuery height 함수를 Vanilla JS로 migration
Vanilla JS와 jQuery의 너비, 높이를 조회하는 방법은 차이가 있습니다. Vanilla JS를 이용하여 Element의 높이를 조회하는 방법을 알아보고, 기존에 jQuery로 작성한 코드를 migration하는 방법을 알아봅시다. ※ 너비(width)와 높이(height)는 규칙이 동일하므로 너비에 관한 설명은 생략합니다. 테스트 환경 Element의 height 관련 프로퍼티 innerHeight : 내부높이 offestHeight : 실제높이 scrollHeight : 스크롤높이 jQuery height 함수를 Vanilla JS로 migration height() innerHeight() outerHeight(), outerHeight(true) 1. 테스트 환경 *,*::before,*..
2020.05.20 -
[jQuery to Vanilla JS] 1. querySelector를 이용하여 jQuery selector 대체하기
이론 Element 조회 - 기본 (id, class, tagname 이용) 2-1) id로 조회 : getElementById 2-2) class로 조회 : getElementsByClassName 2-3) tag 이름으로 조회 : getElementsByTagName Element 조회 - 심화 attribute로 조회 iframe 내부 contents 조회 부모, 자식, 형제 Element 조회 자식 Element 조회 자식 Element 조회 형제 Elements 조회 - all 형제 Element 조회 - prev, next 속성 조회 input, textarea 요소 value 조회 select 선택된 option의 value, text 조회 기타 속성 조회 및 설정 data 속성 조회 tex..
2020.05.11