240430 TIL 열두번째날 - 이벤트 위임

240429 TIL참고

// 내생각 / 색깔글씨 : 중요표시 등

공부한 내용 - 이벤트 위임 잘 사용하려면 ..

event.tatget: 이벤트 발생한 요소, 내가 클릭을 한 장소

event.currenTarget : 이벤트 핸들러가 등록되어있는 요소

여기서 만약에 h3을 클릭했다면 (이벤트 타겟) , ul 태그 : 이벤트핸들러가 등록되어 있으니 이벤트 커런트 타겟

카드와 카드 사이의 공간인 ul태그에 이벤트핸들러를 넣었다면 

fuction handleClickCard(event) {

if (event.target === cardist) return;

                ul을 클릭한 경우        함수 종결 시키기

위의 함수는 return을 만나면 끝남 (js에서는)

if (even.target.matches(".movie-card")) { //il 태그인 무비카드를 클릭했다면 드래그된 부분인 아이디속성

alert(`영화 id: ${event.target.id}`);           // movie.id에 접근할 수 있음.클릭한 il태그 아이디에 접근해서 alert

} else {

alert(`영화id: ${event.target.parentNode.id'}`);

}                                        // <h3>, <p>등의 id 없는 자식태그를 클릭하면 부모인 li로 거슬러 올라와서 접근

}

};

 

----

form 태그는 (기본동작이 새로고침)

semantic tag : 폼 내부에(자식요소들) 제출할 수 있는 요소가 있겠다 라고 예측 (input, button등)

submit 이벤트 발생되는 태그

 

오늘의 코딩테스트

https://8naji.tistory.com/62

코딩테스트 입문 240430 TIL참고글

 

회고 - 강의 다시 듣기 중.. 한번 들었을 때보다 조금 더 알 것 같음

 - 블로그에 써보다가 무식하게 공책에다 손으로 써서 익혀보기로 했다.. 오래걸리려나 😂

일단 목표는 블로그에 한 번, 공책에 한 번... 목표는 높게 🤭

- github 2차 강의 들었는데 해봐야 알것같다.