201227_TIL

🍎 오늘 한 것

---

✔️ twittler 좋아요, 싫어요 버튼 추가하기
각 게시물들에 좋아요, 싫어요 버튼을 추가했다. HTML, CSS 까지는 마치고 Javascript를 통해 새 게시물이 등록될 때마다 버튼이 함께 생성되고, 게시물의 데이터 객체에도 좋아요개수, 싫어요개수를 세는 속성을 추가하는 것 까지 마쳤다. 그런데 event.target을 썼을 때 클래스명을 모든 버튼들이 공유해버려서 타겟 설정이 안되는 문제가 있었다. 이 부분을 마저 개선하는 중이다. 아래와 같은 시도들을 우선 해봤고, 세 번째 시도는 내일 마저 해보려고 한다

시도 1. 각각의 버튼에 id값이 추가된 클래스를 추가로 부여하기 (btn1, btn2 ...)
시도 2. selectorAll로 반환된 배열, 반복문을 이용하기
시도 3. data-* 속성 사용해보기

 

 

🍎 기억할 것

---

✔️ 이벤트 객체
event.target : 이벤트가 발생한 오브젝트
event.target.id : 이벤트가 발생한 오브젝트의 id
event.target.value : 이벤트가 발생한 오브젝트의 값
event.target.parentNode : 이벤트가 발생한 오브젝트의 부모
event.target.firstChild : 이벤트가 발생한 오브젝트의 첫번째 자식

✔️ event.target 과 event.currentTarget의 차이점
event.target : 이벤트버블링의 가장 마지막, 최하위의 요소 반환 (클릭된 요소 기준) -> 이벤트 '생성' 위치
event.currentTarget : 이벤트가 바인딩된, 해당 요소 반환 -> 이벤트 '발생' 위치