728x90
이벤트 추가 : addEventListener
이벤트 삭제 : removeEventListener
addEventListener(연결이벤트, 실행할 함수)
마우스가 버튼에 올라가면 올라갔다고 콘솔로그 뜨고 클릭하면 클릭했다고 뜨고
클릭 후 이벤트가 삭제되면서 mouseover만 작동하고 click은 지우는 js코드 연습
<h3>addEventListener</h3>
<div id="first" class="div0"></div>
<button id="do1">do1 확인</button>
<button id="do2">do2 확인</button>
<script>
var do1 = document.getElementById('do1');
var do2 = document.getElementById('do2');
// var div0 = document.getElementByClass('div0');
function dodo1_1(){
console.log("click");
}
function dodo1_2(){
console.log("in");
}
function div0_1(){
console.log("dvi0");
div0.innerText = "hi";
}
do1.addEventListener('click',dodo1_1);
do1.addEventListener('mouseover',dodo1_2);
do2.addEventListener('click',function(){
console.log('do2 실행. 제거하기');
do1.removeEventListener('click',dodo1_1);
// div0.addEventListener('click',div0_1);
})
</script>728x90
반응형
'small steps > 1일 1코딩 - 코딩을 내 몸처럼' 카테고리의 다른 글
| [1일1코딩][Web] boardDetailView.jsp 2nd (0) | 2022.08.05 |
|---|---|
| [1일1코딩][Git] 브랜치 생성, 변경, 삭제, add, commit, merge (0) | 2022.08.04 |
| [1일1코딩][Java] 간단 입출금,잔액조회 (0) | 2022.08.02 |
| [1일1코딩][Java] 얕은 복사(shallow copy) (0) | 2022.08.01 |
| [1일1코딩][Java] 배열(Array) : 선언, 할당, 초기화, 삭제 (0) | 2022.07.31 |