Javascript

다수의 엘리먼트에 이벤트 등록하기

불타는 코딩🔥 2019. 4. 11. 19:06

document.querySelectorAll('targets') 으로 불러올 경우

nodeList가 유사배열(?)로 넘어오기때문에 [].forEach.call() 을 사용한다.


html

<button class="target-btn"> button01 </button>
<button class="target-btn"> button02 </button>
<button class="target-btn"> button03 </button>
<button class="target-btn"> button04 </button>
<button class="target-btn"> button05 </button>

 

javascript

function enterEvent(_targets, _event, _callback){
        [].forEach.call(_targets, _target => {
            _target.addEventListener(_event, function(e){
                console.log( this, e )
            })
        })
    }
    
    let targets = document.querySelectorAll('.target-btn');
    enterEvent(targets,'click');