addEventListener를 어떻게 업데이트합니까?

Question

javascript의 요소 속성에 쓰는 것보다 addEventListener()를 사용하도록 코드를 업데이트하려고합니다.

이렇게하기 전에 몇 가지 사항을 확인하고 싶습니다.

1) 1. DOM을 업데이트하고 .innerHTML 쓰기로 요소를 제거하면 removeEventListener()를 호출 할 필요가 없다고 가정합니다. IE9, 크롬, 파이어 폭스,

3. 사파리

) 최신 브라우저에 arrise 수있는 다른 문제는 없습니다 -

2) 또는 addEventListener 인기 최신 브라우저에서 지원됩니다.

나는 b.c. 내 코드를 업데이트 할 때 총을 뛰고 싶지는 않습니다.

주 : 이벤트 상관 관계에

특성 (의 제거).

• 때 onKeyPress - 키를 누를 때
• 에 onblur -> 흐림
• onfocus 및 -> 초점

연구

https://developer.mozilla.org/en/DOM/element.addEventListener (가지고 호환성 차트)

http://www.quirksmode.org/js/events_advanced.html

관련

JavaScript listener, "keypress" doesn't detect backspace?

노트

• 대신 false를 반환합니다. preventDefault()를 사용하여 양식이 enter시 제출되지 않도록하십시오.

Answer 1

1. . 예를 들어 실수로 전역 변수에 DOM 요소에 대한 참조를 저장하지 않으면 가비지 수집기가이를 정리해야합니다.

2. 브라우저 지원입니다. 이전 IE의 경우 attachEvent()이 있으며 은 거의입니다.

3. 걱정할 것이 아무것도 없습니다. 이것은 현대적인 방법입니다.

참고 : 당신은 일 크로스 브라우저를 만들기위한 jQuery을 사용할 수 있습니다. 후드에서는 가능한 경우 addEventListener을 사용하고 이전 IE의 경우 attachEvent으로, 다시 normalizes your event object으로 폴백하므로 차이점에 대해 걱정할 필요가 없습니다. 또한 DOM 조작 및 순회에 적합합니다.

Answer 2

1) 당신은 그 문제에 관해서 때 removeEventListener를 호출 할 필요는 없습니다하지만하여 addEventListener를 통해의 EventListener에 부착 된 DOM 요소를 제거 경우 그 아이의 당신이 돈을 제거 할 경우, 때 removeEventListener 를 호출해야합니다 아무것도 제거 할 필요가 없습니다.

2) 또는 addEventListener는 모든 주요 브라우저에서 지원됩니다

3) 또는 addEventListener

4) 때 onKeyPress에 관한 최신 브라우저에 다른 문제가 이벤트하지만, 속성, 이벤트의 이름이되지 않습니다 이름은 keypress입니다.* 모두

빠른 코드에 다른 이름 같은 크로스 브라우저 호환성을 위해 jQuery를 피하기 위해 : 당신은 필요가 없습니다

Element.prototype.on = function(evt, fn) { 
if (this.addEventListener) 
    this.addEventListener(evt, fn, false); 
else if (this.attachEvent) 
    this.attachEvent('on' + evt, fn); 
}; 

Element.prototype.off = function(evt, fn) { 
    if (this.removeEventListener) 
     this.removeEventListener(evt, fn, false); 
    else if (this.detachEvent) 
     this.detachEvent('on' + evt, fn); 
};