모달 바깥 클릭하면 닫히게 만들려다가 이벤트 관련해서 완전 꼬였어요. 안쪽 클릭했는데 바깥 핸들러까지 실행돼서 모달이 닫혀버리고요.
inner.addEventListener("click", (e) => {
// 여기서 뭘 해야 바깥까지 안 퍼지나요?
});
찾아보니까 이벤트가 캡처링 단계로 위에서 아래로 내려왔다가 다시 버블링으로 올라간다는데 이게 정확히 어떤 순서인지 감이 안 와요. addEventListener 세 번째 인자에 true 넣으면 캡처 단계에서 잡힌다는 것도 봤고요. 그리고 stopPropagation이랑 preventDefault 이 두 개가 계속 헷갈립니다. 링크 클릭 막을 때 쓰는 거는 어느 쪽이고, 전파를 멈추는 거는 어느 쪽인가요? 둘이 같이 써야 되는 상황도 있는 건지 아니면 하나로 다 되는 건지 설명 좀 부탁드려요.