1단계 블로그: review.addEventListener("")

1단계 검토

1단계는 오늘 프로젝트 발표 후 책에 포함될 것입니다. 약간 성취감이 있지만 대부분 2단계에 지쳤습니다. 3주 동안 다운로드한 지식의 양은 어마어마합니다! 모든 단계를 끝내기 위해 프로젝트 주간이 있습니다. 저는 Phase 1에서 많은 것을 배웠지만 프로젝트 주간이 가장 즐거웠습니다. 다음은 재미있는 주제입니다.

자바스크립트 기초

문자열

변수

함수(콜백 및 화살표)

배열/객체

DOM 조작

문서 개체 모델

getElementById

querySelector(모두)

JavaScript 이벤트 및 서버와의 통신

addEventListener("onClick")

로드된 DOM 콘텐츠

가져오기/게시/패치/삭제

JSON(데룰로)

그리고 더....

반응하세요!

add.EventListener

콜백과 화살표 함수가 1단계에서 마스터하는 것이 가장 중요하다고 주장하지만 이벤트 리스너를 추가하는 것이 가장 보람 있었습니다.

저에게는 우리 코호트가 이벤트 리스너를 사용하기 시작했을 때 모든 것이 움직이기 시작했습니다. 이벤트 리스너는 "클릭"또는 "키 누름"과 같은 작업을 "수신"합니다. 일단 트리거되면 이벤트 핸들러 함수를 호출하여 이벤트 작업을 시작합니다.

댓글 버튼을 클릭하거나 IG에서 좋아요 ♥ 버튼을 누르는 것을 생각해 보세요.

 "`document.addEventListener("click", myFunction);`" 
                 - w3schools

"<form id="search-form" onsubmit="searchByAbv(event)"
autocomplete="off"> "

이벤트 리스너가 없으면 웹 페이지가 작동하지 않습니다. 이벤트 리스너는 사용자와의 상호 작용을 재미있고 동적으로 만듭니다. 파트너 John과의 1단계 프로젝트를 되돌아보면 이벤트 리스너가 10명 이상입니다! 더 깊이 있는 웹사이트와 이벤트 리스너의 수만 상상할 수 있습니다.

출처:

w3schools
https://www.w3schools.com/jsref/met_element_addeventlistener.asp

아이언 캔버스 https://learning.flatironschool.com/courses/5206

스위트 코드
https://sweetcode.io/understanding-the-javascript-dom-manipulations/

MDN 웹 문서
https://developer.mozilla.org/en-US/docs/Web/API/Element#mouse_events