본문 바로가기
728x90
반응형

JavaScript3

[javascript] 이벤트 캡처링과 버블링 (캡쳐링과 버블링이 발생하는 이유?) 이벤트 캡처링과 버블링(캡쳐링과 버블링이 발생하는 이유?) 이벤트 캡처링과 버블링에 대해 구글링해보고 내 입맛대로 이해한 내용을 정리했다. 1. 이벤트 캡쳐링과 버블링이 발생하는 이유 . 브라우저는 이벤트를 감지한다. 이벤트가 발생하면, 발생한 이벤트의 정보를 가지고 있는 event 객체를 생성한다. event 객체는 무조건 이벤트가 발생한 요소에 전달해야 한다. event 객체에는 많은 정보들이 있지만 그 중에서도, event.type = 발생한 이벤트의 타입 event.target = 이벤트가 발생한 위치의 요소 로 예를 들어보자면 (1) click했다. click event 객체가 만들어진다. event.type = "click" 이다. (2) document에서 가장 최상위 요소에서 click 이.. 2024. 4. 23.
[javascript] event.preventDefault() 1. 사용하는 경우 페이지 이동을 하는 기본동작을 빼주어야 할 때 사용함. 우리가 보통 화면의 버튼에 이벤트를 걸기 위해서는 addEventListener 함수를 사용한다. 요소.addEventListener("이벤트", 함수명); 이벤트 중에서도 submit 이벤트는 form 내용을 제출하는 이벤트로, submit을 하게되면 action로 지정된 url로 이동하거나 url이 없는 경우에는 새로고침이 된다. ... 페이지 내 구조상, 여러 개의 form이 있고 각자 submit을 사용해야 할 필요가 있을 때 ! 페이지 이동 없이 input 내용을 submit하여 데이터를 주고 받을 수 있는 ajax 기능을 사용하게 된다. 다만 ajax는 제이쿼리에 있는 기능이며, vanilla script 로 구현하기 .. 2024. 4. 19.
[javascript] classList 로 반환되는 DOMTokenList 1. DOMTokenList 의 정의 DOMTokenList The DOMTokenList interface represents a set of space-separated tokens. Such a set is returned by Element.classList or HTMLLinkElement.relList, and many others. A DOMTokenList is indexed beginning with 0 as with JavaScript Array objects. DOMTokenList is always case-sensitive. ( 해석내용 ) DOMTokenList 인터페이스는 space를 기준으로 구분되어지는 토큰의 set이다. Element.classList 또는 HTMLLink.. 2024. 4. 3.
728x90
반응형