>웹 프론트엔드 >JS 튜토리얼 >js를 사용하여 브라우저 구현 코드 감지_기본 지식

js를 사용하여 브라우저 구현 코드 감지_기본 지식

WBOY
WBOY원래의
2016-05-16 17:33:48928검색

크로스 브라우저 js 프로그램을 작성할 때 브라우저 감지는 매우 중요한 작업입니다. 때때로 우리는 다양한 브라우저에 대한 분기 코드를 작성해야 합니다.
다음은 그 중 하나입니다.

코드를 복사하세요 코드는 다음과 같습니다

//이벤트 도구 함수 추가
function addEvent(el,type,handle){
if(el.addEventListener){//표준 검색용
el.addEventListener(type,handle ,false);
}else if(el.attachEvent){//IE용
el.attachEvent("on" event,handle);
}else{//other
el[" on" 유형] =handle;
}

}


1, 브라우저를 감지하는 첫 번째 방법은 사용자 에이전트 감지라고 합니다. 가장 오래된 브라우저의 이름과 버전을 포함하여 대상 브라우저의 정확한 모델을 감지합니다. 실제로 navigator.userAgen 또는 navigator.appName을 통해 얻은 문자열입니다.
코드 복사 코드는 다음과 같습니다.

function isIE(){
return navigator .appName.indexOf("Microsoft Internet Explorer")!=-1 && document.all;
}
function isIE6() {
return navigator.userAgent.split(";") [1].toLowerCase().indexOf("msie 6.0")=="-1"?false:true;
}
function isIE7(){
return navigator.userAgent.split("; ")[1 ].toLowerCase().indexOf("msie 7.0")=="-1"?false:true;
}
function isIE8(){
return navigator.userAgent.split( ";") [1].toLowerCase().indexOf("msie 8.0")=="-1"?false:true;
}
function isNN(){
return navigator.userAgent. indexOf("Netscape ")!=-1;
}
function isOpera(){
return navigator.appName.indexOf("Opera")!=-1;
}
function isFF(){
return navigator.userAgent.indexOf("Firefox")!=-1;
}
function isChrome(){
return navigator.userAgent.indexOf("Chrome") > ; -1;
}

2, 두 번째는 객체/특징 감지 방법으로 브라우저의 성능을 판단하는 방법이기도 합니다. 현재. 즉, 객체를 사용하기 전에 객체의 존재를 감지하는 것입니다. 이 메소드는 위에서 언급한 addEvent 메소드에서 사용됩니다. .addEventListener는 w3c dom 표준 방법인 반면 IE는 고유한 attachmentEvent를 사용합니다. 다음은 몇 가지입니다.

a, talbe.cells는 IE/Opera에서만 지원됩니다.

b, innerText/insertAdjacentHTML은 Firefox를 제외한 IE6/7/8/Safari/Chrome/Opera에서 지원됩니다.

c, window.external.AddFavorite는 IE에서 즐겨찾기에 추가하는 데 사용됩니다.

d, window.sidebar.addPanel은 FF 아래 즐겨찾기에 추가하는 데 사용됩니다.


3, 세 번째 유형은 매우 흥미롭습니다. 브라우저 결함 또는 버그 방식이라고 합시다. 즉 특정 성능은 브라우저 제조업체에서 의도적으로 구현하지 않습니다.

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

var isIE = "v1 ";
var isIE = !-[1,];
var isIE = "v"=="v";
isSafari=/a/.__proto__=='//';
isOpera=!! window.opera;

가장 고전적인 판단 방법은 !-[1,]입니다. 현재 IE를 판단하는 데 필요한 최소 코드는 6바이트입니다. 이것은 러시아인에 의해 발견되었습니다. 배열 [1,]의 길이가 사용됩니다. IE 조건부 주석
을 사용하여 코드를 복사하는 영국의 젊은 James Padolsey도 있습니다.

var ie = (function(){
var undef,
v = 3,
div = document.createElement('div'),
all = div. getElementsByTagName('i');

while (
div.innerHTML = '