IE와 Firefox_javascript 기술 간에 JavaScript의 7가지 다른 구문 공유

이 기사에서 저자는 IE와 Firefox의 7가지 JavaScript 구문을 소개합니다.

1. CSS "float" 값

주어진 CSS 값에 액세스하기 위한 가장 기본적인 구문은 object.style.property이며, 값을 커넥터로 바꾸기 위해 camelCase를 사용합니다. 예를 들어 ID가 "header"인

의 배경색 값에 액세스하려면 다음 구문을 사용합니다.

document.getElementById("header").style.BackgroundColor= "#ccc " ;

그러나 "float"라는 단어는 JavaScript 예약어이므로 object.style.float를 사용하여 액세스할 수 없습니다. 여기서는 두 개의 브라우저에서 이 작업을 수행할 수 있습니다.

쓰기 IE의 경우:

코드 복사 코드는 다음과 같습니다.

document.getElementById(" header").style.styleFloat = "left";

Firefox에서 다음을 작성하세요:

코드 복사 코드는 다음과 같습니다.

document.getElementById("header").style.cssFloat = "left";

2. element
JavaScript는 object.style.property 구문을 사용하여 외부에서 CSS 스타일에 쉽게 액세스하고 수정할 수 있지만 이러한 구문은 이미 설정된 인라인 스타일이나 JavaScript에서 직접 설정한 스타일만 가져올 수 있다는 제한이 있습니다. 외부 스타일 시트에 액세스할 수 없습니다. 요소의 "대체된" 스타일에 액세스하려면 다음 코드를 사용할 수 있습니다.

IE에서는 다음과 같이 작성합니다.

코드 복사 코드는 다음과 같습니다.

var myObject = document.getElementById("header");
var myStyle = myObject.currentStyle.BackgroundColor; 🎜>Firefox에서는 이렇게 작성하세요.

코드 복사 코드는 다음과 같습니다. var myObject = document.getElementById( "header");

var myCompulatedStyle = document.defaultView.getComputeStyle(myObject, null);

var myStyle = myCompulatedStyle.BackgroundColor; 요소의 "class"에 액세스
"float"와 마찬가지로 "class"는 JavaScript의 예약어입니다. 이 두 브라우저에서는 "class"에 액세스하기 위해 다음 구문을 사용합니다.

IE에서 작성하세요:

코드 복사

코드는 다음과 같습니다. var myObject = document.getElementById("header"); var myAttribute = myObject.getAttribute("className");

Firefox에서 작성:

코드 복사

코드는 다음과 같습니다. var myObject = document.getElementById("header") var myObject.getAttribute("class");

이 구문은 setAttribute 메서드를 사용해도 적용됩니다.

4. > 3번 항목에서 언급했듯이 태그의 "for"에 액세스하려면 보이지 않는 구문 구별을 사용해야 합니다.

IE에서는 다음과 같이 작성하세요.

코드 복사


코드는 다음과 같습니다.

var myObject = document.getElementById("myLabel") var myAttribute = myObject.getAttribute("htmlFor"); Firefox에서 작성:

코드 복사

코드는 다음과 같습니다.

var = document.getElementById("myLabel") var myAttribute = myObject.getAttribute("for");
5. 마우스 포인터 위치 가져오기
마우스 포인터 위치를 계산하는 것은 매우 드물지만 필요한 경우 IE와 Firefox에서는 구문이 다릅니다. 여기에 작성된 코드는 가장 기본적인 것일 수도 있고, 복잡한 이벤트 처리의 특정 부분일 수도 있습니다. 하지만 유사점과 차이점을 설명할 수는 있습니다. 동시에 IE의 결과는 Firefox와 더 다를 것이며 이 방법 자체에는 버그가 있다는 점을 지적해야 합니다. 일반적으로 이 차이는 "드래그 위치"로 보상할 수 있지만 이는 다른 주제에 대한 기사입니다. :) !

IE에서 다음을 작성하세요. code

코드는 다음과 같습니다. var myCursorPosition = [0, 0] myCursorPosition[0] = myCursorPosition; [1] = event.clientY;

Firefox에서 다음을 작성하세요.

코드 복사

코드 var myCursorPosition = [0, 0]; myCursorPosition[0] = event.pageX; myCursorPosition[1] =

6. 보이는 영역과 창의 크기를 구합니다
때때로 브라우저의 보이는 위치의 크기를 찾아야 하는데, 일반적으로 이를 "가시 영역"이라고 합니다.

IE에서 작성하세요:

코드 복사

코드는 다음과 같습니다. var myBrowserSize = [0, 0]; myBrowserSize[0] = document.documentElement.clientWidth; myBrowserSize[1] = document.documentElement.clientHeight; this in Firefox 쓰기:

코드 복사

코드는 다음과 같습니다:

var myBrowserSize = [ 0, 0]; myBrowserSize[0] = window.innerWidth; myBrowserSize[1] = window.innerHeight; 7. JavaScript 구문 문제는 대신 CSS의 알파 투명성에서 비롯됩니다. 그러나 객체가 페이드 인/아웃되어야 하는 경우 이를 수행하려면 JavaScript가 필요합니다. 이는 일반적으로 루프에서 CSS의 알파 투명도 설정에 액세스하여 수행됩니다. 수정해야 하는 JavaScript 코드는 다음과 같습니다.

in IE:

#myElement { filter: alpha(opacity=50) }

in Firefox에서 작성 :

#myElement { opacity: 0.5 }

IE에서 작성:




코드 복사


코드는 다음과 같습니다.


var myObject = document.getElementById("myElement");

myObject.style.filter = "alpha(opacity=80)"; Firefox에서 작성하세요:

코드 복사

코드는 다음과 같습니다.

var myObject = document.getElementById("myElement"); myObject.style.opacity = "0.5";

성명：

본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.