본문 바로가기

frontend23

[FRONTEND] SPA(Single Page Application) 2023. 2. 12.
[JAVASCRIPT] DOM API, 메소드 체이닝 DOM API Document Object Model, Application Programming Interface // HTML 요소(Element) 1개 검색/찾기 const boxEl = document.querySelector('.box'); // HTML 요소에 적용할 수 있는 메소드! boxEl.addEventListener(); // 인수(Arguments)를 추가 가능! boxEl.addEventListener(1, 2); // 1 - 이벤트(Event, 상황) boxEl.addEventListener('click', 2); // 2 - 핸들러(Handler, 실행할 함수) boxEl.addEventListener('click', function () { console.log('Click~.. 2023. 1. 19.
[JAVASCRIPT] JAVASCRIPT 개요 표기법 dash-case(kebab-case) : html, css snake_case : html, css camelCase : js ParcelCase : js 데이터 종류(자료형) String, Number, Boolean, Undefined, Null, Object, Array 변수 데이터를 저장하고 참조(사용)하는 데이터의 이름 var, let, const 예약어 특별한 의미를 가지고 있어, 변수나 함수 이름 등으로 사용할 수 없는 단어 this, if, break... 함수 특정 동작(기능)을 수행하는 일부 코드의 집합(부분) function 인수(argument) : 함수가 호출될 때 함수로 값을 전달해주는 값 매개변수(parameter) : 함수의 정의에서 전달받은 인수를 함수 내부로 전달.. 2023. 1. 19.
[CSS] CSS 속성 - 전환(transition), 변환(transform) 전환 transition 요소의 전환(시작과 끝) 효과를 지정하는 단축 속성 transition: 속성명 지속시간(필수) 타이밍함수 대기시간; transition-property 전환 효과를 사용할 속성 이름을 지정 기본값 all 모든 속성에 적용 transition-duration 전환 효과의 지속시간을 지정 기본값 0s 전환 효과 없음 transition-timing-function 전환 효과의 타이밍(Easing) 함수를 지정 기본값 ease 느리게 - 빠르게 - 느리게 linear, ease-in, ease-out, ease-in-out transition-delay 전환 효과가 몇 초 뒤에 시작할지 대기시간을 지정 기본값 0s 대기시간 없음 변환 transform transform: 변환함수1 .. 2023. 1. 18.

티스토리툴바