(17) Interactive JavaScript (Event) - 브라우저의 기본 동작 제어

(17) Interactive JavaScript (Event) - 브라우저의 기본 동작 제어

▼ HTML, JavaScript더보기 Link 네이버 접속하기 // 브라우저의 기본 동작const link = document.querySelector("#link");const checkbox = document.querySelector("#checkbox");const input = document.querySelector("#input");const text = document.querySelector("#text");대부분의 이벤트는 발생하는 순간 각 태그별로 혹은 문서 전체적인 측면에서브라우저가 기본적으로 갖고 있는 어떠한 동작들을 수행한다. ▼ 사용자가 웹 페이지를 사용하면서 흔하게 접하는 이벤트 태그는 클릭했을 때 href 속성에 담긴 주소로 웹 페이지 이동checkbox는 클릭을 ..

  • format_list_bulleted JS
  • · 2024. 11. 11.
  • textsms
(16) Interactive JavaScript (Event) - 이벤트 위임

(16) Interactive JavaScript (Event) - 이벤트 위임

▼ HTML, CSS, JavaScript 문서더보기 오늘 할 일 자바스크립트 공부 구름이 산책 게임 독서 청소 .item { margin: 10px 0; cursor: pointer;}.done { opacity: 0.5; text-decoration: line-through;}// 이벤트 위임 (Event Delegation)const list = document.querySelector("#list");for (let item of list.children) { item.addEventListener("click", function (e) { ..

  • format_list_bulleted JS
  • · 2024. 11. 8.
  • textsms
(15) Interactive JavaScript (Event) - 이벤트 버블링

(15) Interactive JavaScript (Event) - 이벤트 버블링

▼ HTML, CSS 문서더보기 content 오늘 할 일 list 자바스크립트 공부 구름이 산책 게임 독서 청소 body * { padding: 7px 10px; margin: 5px 8px; color: #ffffff; font-size: 12px; background-color: rgba(0, 0, 0, 0.4);}h1 { font-size: 20px; font-weight: 500;}아래는 각 요소별로 클릭 타입에 이벤트 핸들러들을 등록한 상태이다.// 이벤트 버블링 (Event Bubbling)const cont..

  • format_list_bulleted JS
  • · 2024. 11. 7.
  • textsms