DOM 및 브라우저 호환성 지침_DOM

웹 프론트엔드 작업자로서 직장에서 브라우저 호환성 문제로 인해 종종 혼란을 느끼시나요? 예를 들어 CSS 스타일? IE 브라우저에서는 일반 웹 페이지가 표시되는 것이 당연합니다. FireFox나 Google Chrome의 경우 엉망입니다. 어쩌면 JavaScript와 Dom을 사용하여 웹 페이지 스크립트를 작성할 때 비슷한 문제에 직면했을 수도 있습니다. 분명히 스크립트는 FireFox 브라우저에서 정상적으로 실행됩니다. IE에서 오류가 발생했습니다. 예를 들어, js 이벤트를 트리거하는 소스 대상을 가져옵니다. 마우스 위치나 요소 위치에도 문제가 있습니다. 이벤트를 요소 등에 동적으로 바인딩합니다. ． ． IE 및 FireFox와 같은 브라우저에서 일부 Dom 명령의 비호환성 문제를 아래에 나열하겠습니다!
공간의 제약이 있습니다. 이 페이지에 언급된 Dom 지침에 대한 자세한 설명은 제공하지 않습니다. 해당 명령어 이름을 클릭하시면 자세한 설명과 예시를 보실 수 있습니다.
JavaScript를 사용하여 트리거된 이벤트의 소스 대상을 얻을 때 IE와 FireFox는 다르게 동작합니다. 즉, 웹 페이지의 어떤 요소가 이벤트를 트리거했는지를 의미합니다.

1. IE 브라우저에서 srcElement 사용
2. FireFox 브라우저에서 대상 사용

웹 페이지 태그 요소 내의 텍스트를 얻고 변경하기 위해 Dom을 사용할 때의 문제

1. IE 브라우저에서 innerText 사용
2. FireFox 브라우저에서 textContent 사용

요소 내 마우스 위치

1. IE에서 offsetX 및 offsetY를 사용하여 웹 페이지의 특정 요소에 대한 마우스 위치를 얻습니다.
2. FireFox는 레이어X와 레이어Y를 사용하여 웹페이지의 특정 요소에 대한 마우스 위치를 가져옵니다.

웹페이지 또는 요소에 대한 이벤트를 동적으로 바인딩하고 삭제할 때 발생하는 문제

1. IE에서 이벤트를 바인딩하는 방법은 attachmentEvent입니다.
2. IE에서 바인딩된 이벤트를 삭제하는 방법은 detachEvent입니다.
3. FireFox에서 이벤트를 바인딩하는 방법은 addEventListener입니다.
4. FireFox에서 바인딩된 이벤트를 삭제하는 방법은 RemoveEventListener입니다

계속... 강국장 : 2010-07-24