> 웹 프론트엔드 > JS 튜토리얼 > IE 및 Firefox_javascript 기술에 대한 일부 JavaScript 호환성 참고 사항 정리

IE 및 Firefox_javascript 기술에 대한 일부 JavaScript 호환성 참고 사항 정리

WBOY
풀어 주다: 2016-05-16 18:09:09
원래의
993명이 탐색했습니다.
1. document.form.item 문제
(1) 기존 문제:
기존 코드에 document.formName.item("itemName")과 같이 사용할 수 없는 구문이 많이 있습니다. Firefox 실행
(2) 솔루션(Firefox):
대신 document.formName.elements["elementName"] 사용
(3) 다른
에 대해서는 2 참조
2 . 컬렉션 클래스 객체 문제
(1) 기존 문제:
기존 코드의 많은 컬렉션 클래스 객체는 IE에 액세스할 때 ()를 사용하지만 Firefox는 이를 허용하지 않습니다.
(2) 해결 방법:
아래 첨자 연산으로 []를 대신 사용하세요. 예: document.forms("formName")는 document.forms["formName"]으로 변경됩니다.
또 다른 예: document.getElementsByName("inputName")(1)이 document.getElementsByName("inputName")[1]으로 변경됨
(3) 기타
window.event
(1) 기존 문제:
Firefox 브라우저에서는 window.event를 사용할 수 없습니다
(2) 해결 방법:
Firefox의 이벤트는 이벤트가 발생한 장면에서만 사용할 수 있는 문제입니다. 아직 해결이 불가능합니다. 다음과 같이 수정할 수 있습니다.
원본 코드(IE에서 실행 가능):

...

새 코드(IE 및 Firefox에서 실행 가능) :

...

또한 새 코드의 첫 번째 줄이 변경되지 않고 이전 코드와 동일한 경우(즉, gotoSubmit 호출이 매개변수 제공), 여전히 IE에서만 작동합니다. 실행되지만 오류는 발생하지 않습니다. 따라서 이 솔루션의 tpl 부분은 여전히 ​​이전 코드와 호환됩니다.
4. HTML 개체의 ID를 개체 이름으로 사용하는 문제

(1) 기존 문제
IE에서는 HTML 개체의 ID를 그대로 사용할 수 있습니다. 문서의 하위 개체 변수 이름입니다. 파이어폭스에는 없습니다.
(2) 해결 방법 객체 변수로 idName 대신 getElementById("idName")를 사용하세요.
5. idName 문자열을 사용하여 객체를 얻을 때 발생하는 문제

(1) 기존 문제
IE에서는 eval(idName)을 사용하여 idName이 있는 HTML 객체를 얻을 수 있습니다. 파이어폭스에서.
(2) 해결책 eval(idName) 대신 getElementById(idName)를 사용하세요.
6. 변수 이름이 HTML 객체 ID와 동일하다는 문제

(1) 기존 문제
Firefox에서는 객체 ID를 이름으로 사용하지 않기 때문에 IE에서는 HTML 객체 ID와 동일한 변수 이름을 사용할 수 있습니다.
(2) 해결 방법
변수 선언 시 항상 var를 추가하여 모호함을 피하도록 하여 IE에서도 정상적으로 실행되도록 하세요.
또한 오류를 줄이려면 HTML 개체 ID와 동일한 변수 이름을 사용하지 않는 것이 가장 좋습니다.
(3) 기타 질문 4 참조
7. Event.x 및 event.y 문제

(1) 기존 문제
IE에서는 이벤트 개체가 있습니다. x, y 속성은 Firefox에서 사용할 수 없습니다.
(2) 해결방법
Firefox에서는 event.x에 해당하는 것이 event.pageX입니다. 그러나 IE에서는 event.pageX를 사용할 수 없습니다.
그래서 event.x 대신 event.clientX가 사용됩니다. 이 변수는 IE에도 존재합니다.
Event.clientX와 event.pageX는 미묘한 차이가 있지만(전체 페이지에 스크롤 막대가 있는 경우) 대부분의 경우 동일합니다.
완전히 동일해지려면 조금 더 문제가 발생할 수 있습니다.
mX = event.x ? event.x : event.pageX
그런 다음 event.x 대신 mX를 사용하세요.
(3) 기타 event.layerX는 IE와 Firefox에 존재하며 구체적인 의미에 차이가 있는지는 아직 테스트되지 않았습니다.
8. 프레임 정보

(1) 기존 문제
window.testFrame을 사용하여 IE에서는 프레임을 얻을 수 있지만 Firefox에서는 얻을 수 없습니다
(2)해결책
프레임 사용에 있어 Firefox와 IE의 주요 차이점은 다음과 같습니다. 프레임 태그에 다음 속성을 쓰면


그러면 IE는 ID 또는 이름 창을 통해 해당 프레임에 액세스할 수 있습니다. object
이고 Firefox는 이름
을 통해서만 이 프레임에 해당하는 창 개체에 액세스할 수 있습니다. 예를 들어, 위의 프레임 태그가 상단 창 내부의 htm에 작성되면
다음과 같이 액세스할 수 있습니다. window.top .frameId 또는 window.top.frameName을 사용하여 이 창 객체에 액세스
Firefox: 이것은 window.top.frameName을 통해 이 창 객체에 액세스하는 유일한 방법입니다.
또한 window.top.document는 다음과 같습니다. Firefox와 IE 모두에서 getElementById("frameId")를 사용하여 프레임 태그
에 액세스하고 window.top.document.getElementById("testFrame").src = 'xx.htm'을 사용하여 내용을 전환할 수 있습니다. 프레임
, window.top.frameName.location = 'xx.htm'을 사용하여 프레임 내용을 전환할 수도 있습니다.
프레임과 창에 대한 설명은 '창과 프레임' 글을 참고하세요. bbs
및 /test/js/test_frame/ 디렉토리 아래의 테스트 ----adun 2004.12.09 수정됨

9. Firefox에서 정의한 속성은 getAttribute로 얻어야 ​​합니다. ()
10. Firefox에는 parentElement parement.children이 없지만

parentNode parentNode.childNodes를 사용합니다.
IE와 Firefox에서는 childNodes의 첨자의 의미가 다릅니다. 사양에 따라 빈 텍스트 노드가 childNodes에 삽입됩니다.
일반적으로 이 문제는 node.getElementsByTagName()을 통해 피할 수 있습니다.
html에서 노드가 누락되면 IE와 Firefox는 parentNode를 다르게 해석합니다. 예를 들어




Firefox의 input.parentNode 값은 form이고, IE의 input.parentNode 값은 빈 노드입니다.
Firefox의 Node에는 RemoveNode 메소드가 없으므로 다음 메소드 node.parentNode.removeChild( node)
11.const 문제
(1) 기존 문제:
IE에서는 const 키워드를 사용할 수 없습니다. const constVar = 32; 이는 IE의 구문 오류입니다.
(2) 해결 방법:
const를 사용하지 말고 대신 var를 사용하세요.
12. 본문 개체
Firefox의 본문은 브라우저가 본문 태그를 완전히 읽기 전에 존재하지만 IE는 본문을 완전히 읽은 후에 존재해야 합니다.
13.
js에서는 URL을 작성하지 말고 직접 작성하세요. 예를 들어 var url = 'xx.jsp?objectName=xx&objectEvent=xxx'
frm.action = url 그러면 URL이 정상적으로 표시되지 않고, 매개변수가 서버에 제대로 전달되지 않을 가능성이 매우 높습니다
일반적으로 서버에서는 매개변수를 찾을 수 없다는 오류를 보고하게 됩니다
물론 예외는 tpl에 있는 경우 tpl은 xml 사양을 따르기 때문에 요구사항 &는 &로 작성됩니다.
일반적으로 Firefox는 js에서 &를 인식할 수 없지만 textNode에는 tagName 값이 없습니다. IE에서는 nodeName
사용에 문제가 있는 것 같습니다. (구체적인 상황은 테스트해보진 않았지만 IE가 여러번 죽었습니다.) (2) 해결 방법: tagName을 사용하되 비어 있는지 감지해야 합니다.

15. 요소 속성

input.type 속성은 IE에서는 읽기 전용이지만 Firefox

16에서는 수정할 수 있습니다. .all[name ] 문제
(1) 기존 문제:
IE에서는 getElementsByName()이나 document.all[name]을 사용하여 div 요소를 얻을 수 없습니다. 얻었나요?)
관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿