2012-05-09 2 views
0

dom0 event model에 대한 기사를 읽음으로써 내가 이해 한 것을 표현하려고합니다. javascript에 실수가 있으면 수정하십시오.javascript의 DOM0 이벤트 모델을 이해

dom0 모델에서는 이벤트 처리기를 요소에 연결할 수 있습니다. 하나의 처리기 만 연결할 수 있습니다. 이벤트가 발생하면 브라우저는 해당 이벤트 처리기를 호출합니다.

1.Inline 모델

핸들러는 element.For의 예 A link element (즉 <a>)의 속성으로 추가됩니다을하는 두 가지 방법이 있습니다이 속성은 onclick을했다. 우리는이 모델의 문제는 그것이() 본문에 넣어 헬로 때문에, 침입 점이다이

<a href="#" onclick="hello();"> say hello </a> 
... 
<script type="text/javascript"> 
    function hello(){ 
     window.alert("Hello"); 
    } 
</script> 

처럼 안녕하세요 함수를 추가 요소의

2.traditional 모델

대신의 요소의 본문 요소의 속성으로 이벤트 핸들러를 추가하는이/핸들러의 제거하면 script.The 핸들러에 의해 이루어집니다를 부가이 같은 요소의 속성에 할당됩니다 아래에

<a href="#" id="hellolink"> say hello </a> 
... 
<script type="text/javascript"> 
    function hello(){ 
     window.alert("Hello"); 
    } 
    //adding handler 
    document.getElementById('hellolink').onclick=hello; 
</script> 
+1

및 질문 * 정확하게 이해한다면 *? – Joseph

+0

예, 제 이해가 정확한지 말해주세요. – damon

답변

2

오른쪽에 대한 것 같습니다. http://www.cross-browser.com/talk/event_interface_soup.php http://en.wikipedia.org/wiki/DOM_events#Traditional_model

을 전통적인 모델에서 코드를 당신은 AA 위해 window.onload 이벤트

이 있어야합니다

읽 할 수 있습니다 그래서 아마 당신이 시간에 jQuery를 같은 것을 당신을 위해 쉽게 사용할 것이다, 당신은 요소 객체를 수신 할 수 있습니다 기능의 안녕을 사용하고있는 브라우저에 따라

그래서

window.onload = function() { 

    var el = document.getElementById('hellolink'); 
    if (el) { 
     el.onclick = hello; 
    } 
}; 

andle 귀하의 DOM 이벤트.

관련 문제