[Event] 이벤트 위임을 사용한 클릭이벤트

다음은 단축메서드로 $ 함수를 정의하며 이벤트 위임을 사용해서 클릭이벤트가 발생한 'A'태그의 기본동작을 막고 href에서 특정값을 추출하기 위한 구문이다.

<ol id="vids">
    <li><input type="checkbox" checked>
          <a href="http://new.music.yahoo.com/videos/--2158073">Gravedigger</a>
    </li>
    <li><input type="checkbox" checked>
          <a href="http://new.music.yahoo.com/videos/--4472739">Save Me</a>
    </li>  
</ol>

var $ = function(id){    
    return document.getElementById(id);  
};

$('vids').onclick = function(e){    
    var src, id;
    e = e || window.event;    
    src = e.target || e.srcElement;
    if(src.nodeName !== 'A'){       
        return;    
    }

    if(typeof e.preventDefault === 'function'){       
        e.preventDefault();    
    }    

    e.returnValue = false;
    id = src.href.split('--')[1];

    alert(id);
}