티스토리

하나씩기록해보기
검색하기
블로그 홈

블로그 홈

하나씩기록해보기

developer-step-by-step.tistory.com/m
신고

이세형 님의 블로그입니다.

구독자
0
방명록 방문하기
구독하기

주요 글 목록

  • 이벤트 위임 그리고 this, e.currentTarget, e.target 이번 글에서는 이벤트 위임에 대해서 알아보자 우선 결과물 모습 부터 보자. 아래와 같은 html 코드가 있을 때, 클릭 되는 대상에게 active 클래스를 붙여주고 기존에 active 클래스를 가지고 있는 대상은 active 클래스를 지워주는 방식으로 구현을 하면 된다. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 .active{ color : red; } DOM (Document Object Model) apple banana melon Colored by Color Scripter cs 이때 각 li 들은 ul의 하위 태그들 이므로 ul을 가져와서 for문을 이용해서 접근하여 직접 이벤트 처리를 할 수 도있다. 하지만 모든 이벤트를 감지 할 수 있는.. 공감수 0 댓글수 0 2020. 11. 19.
  • DOM Elememt를 가져와서 Attribute 값을 조회, 변경 해보자. JavaScript에서 HTML DOM Element의 속성 값을 조회,변경하는 방법에 대해서 알아보자. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 DOM (Document Object Model) apple banana melon Colored by Color Scripter cs 위와 같은 HTML 코드가 있을때 fruit 클래스의 포함된 리스트 중 banana를 선택하고 Atrribute를 조회,변경,추가,삭제를 해보자. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 var fruit = document.querySelectorAll('.fruit'); console.log(fruit); var banana = fruit[1] console.log(banana.. 공감수 0 댓글수 0 2020. 11. 8.
  • 선택자는 QuerySeletor, QuerySeletorAll를 사용하자 JavaScript에 HTML DOM Element를 선택하는 방법이 여러가지 있지만 그 중에서 QuerySeletor, QuerySeletorAll에 대해서 알아보자. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 DOM (Document Object Model) apple banana melon Colored by Color Scripter cs 위와 같은 HTML 코드가 있을때 querySelectorAll과, querySelector를 사용해서 원소에 접근해보자. 파라미터는 선택하고자 하는 원소의 CSS 선택자를 넣어주면 된다. 1 2 3 4 5 6 var fruit = document.querySelectorAll('.fruit'); console.log(fruit); var .. 공감수 0 댓글수 0 2020. 11. 8.
    문의안내
    • 티스토리
    • 로그인
    • 고객센터

    티스토리는 카카오에서 사랑을 담아 만듭니다.

    © Kakao Corp.