자바스크립트 정리 3

<script scr=“main.js”></script>

태그 생성 - createElement
H1 선언 - document.querySelector('h1')
Class 생성 - className (getElementsByClassName)
HTML 내용 생성 - innerHTML
H1요소 내부에 추가 - appendChild

interaction은 HTML이나 CSS만으로 구현할 수 없고 자바스크립트 코딩이 필요합니다. 이렇게 특정 요소에 interactive한 반응을 할 수 있게 하는 것을 이벤트라고 합니다.

• 클릭 이벤트
• 마우스 이벤트
• 스크롤 이벤트
• 터치 이벤트
• resize(화면 크기 변화) 이벤트

이벤트를 달 때 사용하는 함수 이름 - addEventListener

요소.addEventListener(이벤트종류, function() {
//이벤트가 일어났을 때 실행할 내용
});

특정 요소에 addEventListener 함수를 붙이고(호출하고), 인자로 이벤트 종류와, 이벤트가 발생했을 때 실행할 함수를 전달합니다. 그 동안에 인자로 배열, String, Number, Date 객체는 전달하는 것을 봤는데... 함수도 인자로 전달할 수 있습니다. 이렇게 인자로 전달된 함수를 콜백 함수라고 부릅니다.

이벤트 페이지

https://storage.googleapis.com/replit/images/1554723016530_25b06f82c125862353d80bdbbfee752b.pn