이 기사는 IE 및 Firefox 브라우저의 JavaScript의 일반적인 호환성 문제를 요약하고 분석합니다. 다음과 같이 참조에 대해 공유하십시오.
형태
document.formname.item ( "itemname")
IE : Document.FormName.Item ( "ItemName") 또는 Document.FormName.Elements [ "ElementName"]를 사용할 수 있습니다.
Firefox : 유일한 document.formname.elements [ "ElementName"]
솔루션 : document.formname.elements [ "elementName"] 사용
수집 클래스 객체
즉 : () 또는 []를 사용하여 컬렉션 클래스 객체를 얻을 수 있습니다.
Firefox : Collection 클래스 객체를 얻기 위해 [] 만 사용하십시오.
솔루션 : []를 사용하여 통일 된 방식으로 수집 클래스 객체를 얻습니다.
맞춤 속성
IE : 정기적 인 속성을 얻는 방법을 사용하여 사용자 정의 속성을 얻거나 getAttribute ()를 사용하여 사용자 정의 속성을 얻을 수 있습니다.
Firefox : getAttribute () 만 사용하여 사용자 정의 속성을 얻을 수 있습니다.
솔루션 : getAttribute ()를 통해 맞춤 속성을 균일하게 얻습니다.
요소 획득
평가 ( "idname")
IE : Eval ( "Idname") 또는 getElementById ( "idname")를 사용하여 idname을 가진 html 객체를 얻을 수 있습니다.
Firefox : getElementById ( "idname") 만 사용하여 idname이있는 idname을 가진 html 객체를 가져올 수 있습니다.
솔루션 : getElementByid ( "idname")를 사용하여 idname으로 id를 가진 html 객체를 얻습니다.
중복 이름 지정
특정 HTML 객체 ID와 동일한 변수 이름의 문제
IE : HTML 객체의 ID는 문서의 하위 객체의 변수 이름으로 직접 사용할 수 있지만 Firefox에서는 사용할 수 없습니다.
Firefox : HTML 객체 ID와 동일한 변수 이름을 사용할 수 있지만 IE에서는 할 수 없습니다.
해결 방법 : document.idname 대신 document.getElementByid ( "idname")를 사용하십시오. 오류를 줄이기 위해 동일한 HTML 객체 ID를 가진 가변 이름을 가져 가지 않는 것이 가장 좋습니다. 변수를 선언 할 때는 모호성을 피하기 위해 Var를 추가하십시오.
Const
IE : VAR 키워드 만 사용하여 변수를 정의하십시오.
Firefox : Const 키워드 또는 VAR 키워드를 사용하여 변수를 정의 할 수 있습니다.
솔루션 : VAR 키워드를 사용하여 변수를 균일하게 정의하십시오.
입력. 타입
입력. 타입 속성 문제
IE : 입력. 타입 속성은 읽기 전용입니다.
Firefox : input.type 속성이 읽고 쓰여집니다.
Window.event
Firefox 이벤트는 이벤트가 발생하는 장면에서만 사용할 수 있기 때문에 Firefox가 아닌 IE에서만 실행할 수 있습니다.
Firefox : 매개 변수 전달 소스에서 이벤트를 추가해야합니다. 즉,이 매개 변수를 무시하고 Window.event를 사용하여 이벤트를 읽습니다.
해결책:
<script language = "javaScript"> function fun (e) {e = e? e : (window.event? window.event : null); } </스크립트>event.x 및 event.y
설명 : 즉, 짝수 객체에는 x 및 y 속성이 있지만 pagex 및 pagey 속성은 없습니다. Firefox에서 짝수 객체에는 pagex 및 pagey 속성이 있지만 x 및 y 속성은 없습니다.
솔루션 : event.x 대신, event.pagex에서 event.x 대신 mx (mx = event.x? event.x : event.pagex;)를 사용하십시오.
이벤트 .Srcelement
IE : 이벤트 객체에는 srcelement 속성이 있지만 대상 속성은 없습니다.
Firefox : 객체조차도 대상 특성이 있지만 srcelement 속성은 없습니다.
솔루션 : OBJ (obj = event.srcelement? event.srcelement : event.target;) event.srcelement 대신 IE 또는 event.target을 사용하여 Firefox를 사용하십시오. 이벤트의 호환성 문제에주의하십시오.
Window.location.href
IE 또는 Firefox2.0.x : Window.Location 또는 Window.location.href를 사용할 수 있습니다.
Firefox1.5.x : Window.location 만 사용됩니다
해결 방법 : Window.location.href 대신 Window.location을 사용하십시오.
모달 및 비 모달 창
즉 : 모달 및 비 모달 창은 showmodaldialog 및 showmodelessdialog를 통해 열 수 있습니다.
Firefox : 아니요!
솔루션 : Window.open (PageUrl, 이름, 매개 변수)을 사용하여 새 창을 열십시오.
자식 창의 매개 변수를 상위 창으로 다시 전달 해야하는 경우 Child Window에서 Window.opener를 사용하여 부모 창에 액세스 할 수 있습니다. 예를 들면 : var parwin = wind
액자
다음 프레임이 예입니다.
<frame src = "xxx.html"id = "frameid"name = "framename" />
1. 프레임 개체 액세스 :
[IE의 반환 된 객체는 객체이며 특정 유형은 다음과 같은 FF에 표시됩니다.
IE : Window.FrameID 또는 Window.FramEname을 사용 하여이 프레임 객체에 액세스하십시오. Frameid와 Framename은 동일한 이름을 가질 수 있습니다.
Firefox : Window.frameName 만 사용 하여이 프레임 객체에 액세스 할 수 있습니다.
IE와 Firefox 모두에서 Window.Document.GetElementById ( "FrameID")를 사용 하여이 프레임 객체에 액세스 할 수 있습니다.
2. 스위치 프레임 컨텐츠 :
IE 및 Firefox에서는 Window.Document.getElementById ( "TestFrame"). SRC = "XXX.html"또는 Window.framename.location = "xxx.html"을 사용하여 프레임의 내용을 전환 할 수 있습니다.
프레임의 매개 변수를 부모 창으로 다시 전달 해야하는 경우 (오프너가 아니라 부모 프레임이라는 참고) 프레임의 부모를 사용하여 부모 창에 액세스 할 수 있습니다. 예 : parent.document.form1.filename.value = "a";
몸
IE : 바디 태그가 브라우저에서 완전히 읽은 후에 신체가 존재해야합니다.
Firefox : 바디 태그가 브라우저에서 완전히 읽기 전에 신체가 존재합니다.
이벤트 대표 방법
IE : 코드 사본은 다음과 같습니다. document.body.onload = inject; // function inject ()가 그 전에 구현되었습니다
Firefox : 코드 사본은 다음과 같습니다. document.body.onload = inject ();
부모 요소
Firefox와 IE Parent Element (Parentelement)의 차이
IE : obj.parentElement
Firefox : obj.parentNode
솔루션 : Firefox와 IE가 모두 DOM을 지원하기 때문에 OBJ.ParentNode를 사용하는 것이 좋습니다.
마우스 포인터 커서
커서 : 핸드 대 커서 : 포인터
Firefox : 손으로 지원되지 않습니다
IE : 포인터 지원
해결책 : 포인터를 균일하게 사용하십시오
컨텐츠 텍스트
내 텍스트는 정상적으로 작동합니다. 그러나 내부 텍스트는 Firefox에서 작동하지 않으므로 TextContent가 필요합니다.
해결책:
if (navigator.appName.indexOf ( "탐색기")> -1) {document.getElementById ( 'element'). innerText = "내 텍스트"; } else {document.getElementById ( 'element'). textc; }테이블의 작동
즉, Firefox 및 기타 브라우저는 테이블 태그에 대해 다른 작업을 가지고 있습니다. 즉, 내부 html 값을 테이블 및 tr에 할당 할 수 없습니다. JS를 사용하여 TR을 추가 할 때는 AppendChild 메소드가 유용하지 않습니다.
해결책:
// 빈 줄을 테이블에 추가하십시오 : var row = otable.insertrow (-1); var cell = document.createelement ( "TD"); cell.innerhtml = ""; cell.classname = "a"; Row.appendChild (셀);
옵션 수집
선택에서 옵션 컬렉션의 작동
[] 외에도 selectname.options.item ()도 가능합니다. 또한 selectName.Options.length, selectName.Options.Add/remain은 두 브라우저 모두에서 사용할 수 있습니다.
*추가 후에 요소가 할당됩니다. 그렇지 않으면 실패합니다.
xmlhttp
if (wind } else if (wind } if (xmlhttp) {xmlhttp.onreadyStateChange = xmlhttpchange; xmlhttp.open ( "get", url, true); xmlhttp.send (); }JavaScript 관련 컨텐츠에 대한 자세한 내용은이 사이트의 주제를 확인하십시오. "JavaScript 오류 및 디버깅 기술 요약", "JavaScript 수학 운영 사용법 요약", "JavaScript의 JSON 운영 기술 요약", "Javascript Switching 특성 및 기술 요약", "Javascript Search Enfective의 요약" "JavaScript 데이터 구조 및 알고리즘 기술 요약"및 "JavaScript Traversal 알고리즘 및 기술 요약"
이 기사가 모든 사람의 JavaScript 프로그래밍에 도움이되기를 바랍니다.