이벤트처리기 2

[Do it! 자바스크립트 입문] 19 - 8장 문서 객체 모델(DOM)요소 예제 풀이, 이벤트 처리하기 / addEventLister()

안녕하세요! 오늘은 DOM 요소 예제 문제 풀이와 이벤트 처리하는 방법을 배워보겠습니다. 1. DOM 요소 예제 풀이 - 선택한 상품 이미지 표시하기 선택한 상품 이미지 표시하기 예제 풀이 순서 1. querySelector(),querySelectorAll() 함수를 사용하여 큰 이미지와 작은 이미지 가져오기 2. for문을 사용하여 작은 이미지를 클릭할 때 큰 이미지로 나타나게 실행하기 3. 큰 이미지의 파일 경로 바꾸기 0단계 HTML, CSS 기본 셋팅 1단계 querySelector(),querySelectorAll() 함수를 사용하여 큰 이미지와 작은 이미지 가져오기 큰 이미지는 id="cup", 작은 이미지는 class="small"의 값을 주었습니다. bigPic이라는 변수에 querySe..

[Do it! 자바스크립트 입문] 12 - 5장 이벤트(event)와 이벤트 처리기(event Handler), click, mouseover, mouseout

05 - 5 이벤트 다루기 #1 이벤트(event) 자바스크립트에서 이벤트란 웹 브라우저나 사용자가 행하는 어떤 동작을 말합니다. ↓↓↓ 이벤트 목록 모음 ↓↓↓ https://developer.mozilla.org/en-US/docs/Web/Events Event reference | MDN Events are fired to notify code of "interesting changes" that may affect code execution. These can arise from user interactions such as using a mouse or resizing a window, changes in the state of the underlying environment (e.g. low ..

728x90