일하면서 기록하기

HTML에서 커스텀 데이터라고 데이터를 저장하는 방법이 있다.
data-작명="값"  이런 방식으로 넣으면 된다.

데이터 속성은 순 HTML이기 때문에 CSS에서도 접근이 가능하다.

자바스크립트에서 커스텀 데이터에 접근하려면
document.getElementByClassName('tab-button').dataset.id; 이렇게 하면 접근할 수 있다.

커스텀 데이터 말고도 제이쿼리로도 데이터를 강제로 입력할 수 있다.

$('.list).data('작명', '값'); 이렇게 하고

console.log( $('.list).data('작명') ); 찍어보면

이렇게 데이터를 저장하고 불러올 수 있다.

$('.class or #id').click(function(e){
     e.target;                   //지금 실제로 클릭한 요소
     e.currentTatget;          //지금 이벤트리스너가 달린곳
     $(this);                     //지금 이벤트리스너가 달린곳
     e.preventDefault;        //기본동작막기
     e.stopPropagation();    //선택한 곳의 상위요소로의 이벤트 버블링을 중단할때 사용
});

$('.black-background').click(function(){     
     if ( e.target == e.currentTarget ){
          $('.black-background').hide() }
});

위에서 처럼 if문 쓸때 e.target == $("#id") 이렇게 조건을 주면 안먹힌다.

e.target는 쌩 자바스크립트고 $("#id")는 제이쿼리기 때문에 서로 인식을 못한다.

서로 비교할려면 자바스크립트끼리 하거나 제이쿼리 끼리 해야한다.

https://tutorialpost.apptilus.com/code/posts/jquery/jq-event-handling/

http://daplus.net/javascript-javascript-jquery%EC%97%90%EC%84%9C-e%EB%8A%94-%EB%AC%B4%EC%97%87%EC%9D%84-%EC%9D%98%EB%AF%B8%ED%95%A9%EB%8B%88%EA%B9%8C/

https://webclub.tistory.com/455