JS judges the browser type to handle browser compatibility

When it comes to webpage incompatibility in various browsers, we usually handle the problem by judging the browser and then writing different JS or CSS styles, below are some common browser judgment js:

Windows operating system browser series:

IE browser series:

Features: all features start with "mozilla/", and "x" in "msie x.0;" indicates the version;
Method of determination: you can retrieve only the "msie x.0;" string by rough judgment, and strictly judge the searchable "mozilla/x.0 (compatibal; msie x.0; windows nt", but this is generally not necessary.
Windows Firefox:
Features: starting with "mozilla/x.0", including "windows nt", "gecko/", and "firefox /";
Method of determination: you can retrieve only the "firefox/" and "windows nt" strings, and strictly search for "mozilla/", "windows nt ", four strings: "gecko/" and "firefox;
Windows Chrome:
Features: starting with "mozilla/x.0", including "windows nt", "chrome/", and "applewebkit/", "safari /";
Method of determination: you can retrieve only the "windows nt" and "chrome/" strings, and strictly determine whether you can search for "mozilla/", "windows nt", "applewebkit /", "safari/", "chrome/" five strings;
Windows Opera:
Features: It starts with "opera/" and contains "windows nt" and "presto/" strings;
Method of determination: roughly judge to retrieve only the "windows nt" and "opera/" strings, and strictly judge to retrieve "opera/", "windows nt", and "presto/" at the same time /";
Safari for Windows:
Features: It starts with "mozilla/" and contains "windows nt", "applewebkit/", and "safari /";
Method of determination: you can retrieve "windows nt", "safari/", but not "chrome/", and strictly determine whether "mozilla/", "windows nt ", "applewebkit/", "safari/", but not "chrome /";
Summary: The browser userAgent on Windows OS contains a "windows nt" string to characterize windows OS.

Example 1

The Code is as follows:

Copy code

<Script> // Obtain the browser name and version information Function appInfo (){ Var browser = { Msie: false, firefox: false, opera: false, safari: false, Chrome: false, netscape: false, appname: 'unknown ', version: 0 }, UserAgent = window. navigator. userAgent. toLowerCase (); If (/(msie | firefox | opera | chrome | netscape) D + (d [d.] *)/. test (userAgent )){ Browser [RegExp. $1] = true; Browser. appname = RegExp. $1; Browser. version = RegExp. $2; } Else if (/versionD + (d [d.] *). * safari/. test (userAgent) {// safari Browser. safari = true; Browser. appname = 'safari '; Browser. version = RegExp. $2; } Return browser; } // Call example Var myos = appInfo (); // If the current browser is IE, the browser version is displayed. Otherwise, the current browser name and version are displayed. If (myos. msie ){ Alert (myos. version ); } Else { Alert (myos. appname + myos. version ); } </Script>

Example

01

The Code is as follows:

Copy code

<! DOCTYPE html PUBLIC "-// W3C // dtd xhtml 1.0 Transitional // EN" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"> 02 03 04 <meta http-equiv = "Content-Type" content = "text/html; charset = UTF-8"/> 05 <title> untitled document </title> 06 07 <script type = "text/javascript"> 08 function isIE (){ 09 return navigator. appName. indexOf ("Microsoft Internet Explorer ")! =-1 & document. all; 10} 11 function isIE6 (){ 12 return navigator. userAgent. split (";") [1]. toLowerCase (). indexOf ("msie 6.0") = "-1 ″? False: true; 13} 14 function isIE7 (){ 15 return navigator. userAgent. split (";") [1]. toLowerCase (). indexOf ("msie 7.0") = "-1 ″? False: true; 16} 17 function isIE8 (){ 18 return navigator. userAgent. split (";") [1]. toLowerCase (). indexOf ("msie 8.0") = "-1 ″? False: true; 19} 20 function isNN (){ 21 return navigator. userAgent. indexOf ("Netscape ")! =-1; 22} 23 function isOpera (){ 24 return navigator. appName. indexOf ("Opera ")! =-1; 25} 26 function isFF (){ 27 return navigator. userAgent. indexOf ("Firefox ")! =-1; 28} 29 function isChrome (){ 30 return navigator. userAgent. indexOf ("Chrome")>-1; 31} 32 33 function showResult (){ 34 if (isChrome ()){ 35 alert ("This is Google Chrome "); 36} 37 38 if (isIE ()){ 39 alert ("This is IE "); 40} 41 42 if (isIE6 ()){ 43 alert ("This is isIE6 ″); 44} 45 46 if (isIE7 ()){ 47 alert ("This is isIE7 ″); 48} 49 50 if (isIE8 ()){ 51 alert ("This is IisIE8 ″); 52} 53 54 if (isNN ()){ 55 alert ("This is isNN "); 56} 57 58 if (isOpera ()){ 59 alert ("This is isOpera "); 60} 61 62 if (isFF ()){ 63 alert ("This is isFF "); 64} 65} 66 </script> 67 68 69 70 71 <body> 72 <center> <input type = "button" onclick = "showResult ()" name = "check" value = "detect" style = "width: 200px; height: 30px; "/> </center> 73 </body> 74