혜개바라
close
프로필 배경
프로필 로고

혜개바라

  • 분류 전체보기 (170)
    • 코테 준비 (46)
      • 알고리즘 (8)
      • [JS] 프로그래머스 (37)
      • [MYSQL] 프로그래머스 (1)
    • 언어 정리 (52)
      • JavaScript (52)
      • TypeScript (0)
    • 개발 공부 (26)
      • HTML (2)
      • CSS (2)
      • React-Next.js (6)
      • Vue (0)
      • Tanstack Query (1)
      • Webpack (4)
      • Github (2)
      • MYSQL (2)
      • 기타 (개발 공부) (7)
    • 프로젝트 (22)
      • Vanilla JS 문서편집기 (10)
      • 올해도 아좌좌 (5)
      • 개발괴발 (5)
      • 기타 (프로젝트) (2)
    • 회고 (18)
    • 블로그 관리 (0)
    • 기타 (4)
  • 홈
  • 코테 준비
  • 언어 정리
  • 개발 공부
  • 프로젝트
  • 회고
  • 태그
  • 방명록
  • github@suehdn
이벤트를 간편하게 걸고 싶은 당신을 위한 ”이벤트 버블링,캡처링, 위임”

이벤트를 간편하게 걸고 싶은 당신을 위한 ”이벤트 버블링,캡처링, 위임”

여러분은 여러개의 버튼을 반복문을 통해 만들었고, 각 버튼에 이벤트를 추가해야한다면 어떤 방식을 사용하시나요?일일히 쿼리를 querySelector로 가져와 이벤트를 추가하시는 분이 있으시다면 이 글을 본 뒤 한번 적용해 보시면 좋을것 같습니다.이벤트를 등록하는 법이벤트에 반응하기 위해선 이벤트가 발생했을 때 실행되는 함수 핸들러(handler)를 할당해야 합니다.my buttonvar button = document.querySelector('button');button.addEventListener('click', (event) => { console.log(event);});우리는 위의 예시와 같은 코드를 통해 버튼을 만들고, 그 버튼을 클릭했을때 어떤 동작을 할 지 정할 수 있습니다. 이때 브라우..

  • format_list_bulleted 개발 공부/HTML
  • · 2024. 8. 7.
  • textsms
  • navigate_before
  • 1
  • navigate_next
공지사항
전체 카테고리
  • 분류 전체보기 (170)
    • 코테 준비 (46)
      • 알고리즘 (8)
      • [JS] 프로그래머스 (37)
      • [MYSQL] 프로그래머스 (1)
    • 언어 정리 (52)
      • JavaScript (52)
      • TypeScript (0)
    • 개발 공부 (26)
      • HTML (2)
      • CSS (2)
      • React-Next.js (6)
      • Vue (0)
      • Tanstack Query (1)
      • Webpack (4)
      • Github (2)
      • MYSQL (2)
      • 기타 (개발 공부) (7)
    • 프로젝트 (22)
      • Vanilla JS 문서편집기 (10)
      • 올해도 아좌좌 (5)
      • 개발괴발 (5)
      • 기타 (프로젝트) (2)
    • 회고 (18)
    • 블로그 관리 (0)
    • 기타 (4)
최근 글
인기 글
최근 댓글
태그
  • #프로젝트
  • #js
  • #VanillaJS
  • #js메서드
  • #프로그래머스
  • #JavaScript
  • #0단계
  • #코딩테스트준비
  • #회고
  • #2023
전체 방문자
오늘
어제
전체
Copyright © 쭈미로운 생활 All rights reserved.
Designed by JJuum

티스토리툴바