Use js to detect browser implementation code_Basic knowledge-JS Tutorial-php.cn

When writing cross-browser js programs, browser detection is a very important task. From time to time we have to write branched code for different browsers.
The following is one:

Copy the code The code is as follows:

//Add event tool function
function addEvent(el,type,handle){
if(el.addEventListener){//for standard browses
el.addEventListener(type,handle,false);
}else if(el.attachEvent){//for IE
el.attachEvent("on" event,handle);
}else{//other
el["on" type] =handle;
}

}

1, The first way to detect browsers is called user-agent detection. The oldest, it detects the exact model of the target browser, including the browser's name and version. In fact, it is a string, obtained by navigator.userAgen or navigator.appName. As follows:

Copy code The code is as follows:

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, The second is called object/feature detection method, which is a way to judge the browser's capabilities and is also a popular method currently. That is, detecting the existence of an object before using it. This method is used in the addEvent method mentioned above. .addEventListener is the w3c dom standard method, while IE uses its own unique attachEvent. Here are a few:

a, talbe.cells is only supported by IE/Opera.

b, innerText/insertAdjacentHTML is supported by IE6/7/8/Safari/Chrome/Opera except Firefox.

c, window.external.AddFavorite is used to add to favorites under IE.

d, window.sidebar.addPanel is used to add to favorites under FF.

3, The third type is very interesting, let’s call it browser defect or bug method, that is, certain performances are not deliberately implemented by the browser manufacturer. As follows:

Copy code The code is as follows:

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

The most classic judgment method is !-[1,]. Currently, the minimum code to judge IE only requires 6 bytes. This was discovered by a Russian. The length of the array [1,] is used. There is also a young James Padolsey from the UK who uses IE conditional comments

to copy the code The code is as follows:

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

 while (
 div.innerHTML = '
            

Previous article：Jquery CSS3 implements a simple and atmospheric pop-up layer with sliding effect_jquery Next article：Introduction and understanding of Javascript garbage collection mechanism_Basic knowledge

Statement of this Website

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn