2012-05-03 3 views
1

나는 javascript의 새로운 학습자이며, 다음 코드는 javascript의 명확한 가이드에서 가져온 것입니다. 요소에 이벤트 추가

function addEvent(elem, evtType, func) 
{ 
    if (elem && typeof(elem) == "object") 
    { 

     if (elem.addEventListener) 
     { 
     elem.addEventListener(evtType, func, false); 
     } 

     else 
     { 
     elem["on" + evtType] = func; 
     } 
    } 
} 

는 왜

if (elem.addEventListener) 
    { 
    elem.addEventListener(evtType, func, false); 
    } 

를 추가하지만 window.onload는 모든 브라우저에서 확인을 작동합니다. 다음은 나의 테스트 예제이다.

<script type="text/javascript"> 
     window.onload=myFuntion(); 
     function myFuntion(){ 
      alert("test"); 
     } 
    </script> 
</head> 

<body> 

    <h1> testtste </h1> 
</body> 

IE에서 잘 작동합니다.

+0

jQuery 라이브러리를 살펴보십시오. DOM 조작을 훨씬 쉽게 해주지 만, 이벤트, 애니메이션, 아약스 등을 제공합니다. – ppumkin

+0

@ppumkin 적어도 누군가가 어떻게 작동하는지 이해하려고합니다 :). – kapa

+0

일부 Quirks 모드 읽기 : [전통적인 이벤트 등록 모델] (http://www.quirksmode.org/js/events_tradmod.html), [고급 이벤트 등록 모델] (http://www.quirksmode.org/js/events_advanced. HTML) – kapa

답변

2

직접 할당은 강력하지 않습니다.

... 코드에로드시 함수가 실행되지 않습니다. 즉시 실행하고 onload 개체에 반환 값 (undefined)을 할당합니다.

우리는 시위가 있음을 수정하는 경우 :

<script type="text/javascript"> 
     window.onload=myFuntion; 

     function myFuntion(){ 
      alert("test"); 
     } 
    </script> 
    <script type="text/javascript"> 
     window.onload=myOtherFunction; 

     function myOtherFunction(){ 
      alert("test2"); 
     } 
    </script> 

이벤트가 덮어 쓰기됩니다. 하나의 기능 만 발동됩니다.

... 최종 가이드의 예는별로 좋지 않습니다. 여러 개의 이벤트 바인딩을 허용하는 기존 독점 API (예 : IE 8 이하의 경우 attachEvent)를 시도하는 대신 직접 할당 (오히려 무의미 함)으로 되돌아갑니다.

관련 문제