JS determines the type and version of the browser by analyzing the useragent attribute

 javascript is the primary language for front-end development, and we can write JavaScript programs to determine the type and version of the browser. JavaScript can determine browser types in general there are two ways, one is based on a variety of browser-specific properties to distinguish, the other is by analyzing the browser's useragent properties to judge. This paper analyzes the useragent characteristics of browsers, and gives the judgment method:  

  Windows operating system Browser series:    IE browser series:  feature performance: "mozilla/", "MSIE x.0;" In the X represents its version;  judgment method: Rough judgment can only retrieve "m Sie x.0; "String can be strictly judged searchable" mozilla/x.0 (Compatibal; MSIE x.0; Windows NT, but generally not necessary   Windows version firefox:  features: "mozilla/x.0", including "Windows NT", "gecko/" and "firefox/";   Judgment method: Rough judgment can retrieve only "firefox/" and "Windows NT" strings, strictly judge can retrieve "mozilla/", "Windows NT", "gecko/" and "firefox/" four strings;  Windows version chrome:  features: Starts with "mozilla/x.0", includes "Windows NT", "chrome/", and includes "applewebkit/", "safari/";  Judgment method: Rough judgment can retrieve only "Windows NT" and "chrome/" string, strict judgment can retrieve "mozilla/", "Windows NT", "applewebkit/", "safari/", "chrome/" Five strings;  Windows version opera:  features: "opera/", with "Windows NT", "presto/" string;  judgment Method: Rough judgment retrieves only "Windows NT" and " opera/"string, strictly judge to retrieve" opera/"at the same time," Windows NT "and" presto/";  Windows edition safari:  feature performance: Start with" mozilla/"and contain" Windows NT "," applewebkit/"," safari/";  judgment method: Rough judgment can be retrieved containing" Windows NT "," safari/"also does not contain" chrome/", strict judgment needs to contain" mozilla/"," Windows NT "," applewebkit/"," Safari/"but does not contain the" chrome/";  Summary: The browser useragent on the Windows operating system contains a" Windows NT "string to represent the Windows operating system.     iphone Platform browser series:    iphone safari:  features: "mozilla/" with the "iphone" string, including "mobile/", " safari/"String;  judgment method: A rough decision to retrieve only the" iphone "and" safari/"string, strict judgment to include" mozilla/"," iphone "," mobile/"," safari/"four strings   iphone version of opera mobile:  features: "opera/" at the beginning, containing the "iphone" string, while containing "opera mini/", "presto/" string;  judgment method: Rough Judgment only Retrieve The "iphone" and "opera/" strings are strictly judged to include both "opera/", "iphone", "Opera mini/", "presto/" four strings   summaries: The iphone's browser useragent contains "iphone" string     Android platform Browser series:    Android's own browser (some say it's just chrome, but Google didn't make a presentation, And is also developing an Android-run chrome to Phone):  feature: "mozilla/" with "Android" and "Linux" strings, with "applewebkit/", "mobile safari/"String;  judgment method: Because it is not known whether Android will have an independent safari in the future (not expected), so it is recommended to strictly judge directly, retrieve" mozilla/"," Android "," Linux "," applewebkit/"," mobile safari/"five strings   Android version of opera mobile:  features:" opera/"with" Android "and" Linux "strings, including "Opera mobi/", "presto/" string; &nbSp Judging method: The rough judgment searches only "Android" and "opera/", the strict judgment must also include "opera/", "Android", "Linux", "Opera mobi/", "presto/" five strings   Android firefox:  Features: "mozilla/" with "Android" and "Linux" strings, with "firefox/", "gecko/", "fennec/" strings;  Judging method: The rough judgment searches only "Android" and "firefox/", the strict judgment must also include "mozilla/", "Android", "Linux", "firefox/", "gecko/", "fennec/" six strings   Summary: The Android platform's browser useragent contains both "Android" and "Linux" strings     The main browser parsing for Windows, iphone, and Android is almost over. , Linux on other platforms should be at least as similar as the Android platform, and the ipad and Macintosh with Mac OS should be similar to the iphone platform, so there is no resolution for the time being, and because there are not so many devices and operating systems to test, I hope to be able to fill it later.     Current Web site product development requirements are not the same as in the past, because not only to meet the computer browsing, but also to meet the user through the smart phone (here is only the iphone, Android, Windows Phone, and so on real smart phones, BlackBerry and palm Such a small public half intelligent system for the time being not considered, as for Symbian this pseudo intelligent system on the side to play it through the above three representative platform, can also be roughly measured according to the browser useragent to judge the user device solution.     1, if you need to judge the operating system, the method is relatively simple, in useragent to retrieve the following string:    contains "Windows NT": Obviously, the Windows operating system, The version number after NT can be used to determine the OS version;  contains "Mac": Apple's Mac OS X or other Mac OS kernel system;  contains an "iphone": proprietary to Apple's iphone and should normally contain a "Mac";  containing "ipad": Apple ipad tablet computer (data shows ipad browser UseragENT also contains "Mac", "iphone", "ipad";  contains "Linux": Linux operating system or other Linux as the kernel of the operating system;  contains "Android": Google's Android operating system, It could be a smartphone, or it could be an Android tablet, and in general the useragent on the Android platform should also include "Linux", one of the "Unix"; , "SunOS" and "BSD": Unix systems, In fact, the user experience problem for this system, now almost can not consider the;  contains "ubuntu": Ubuntu custom version of the linux  ......    You also see, to determine the operating system and its version is not always useful, But there are always places to use, such as the development of the iphone, ipad, Android and other Devices screen resolution     2, to determine the browser's kernel, the method is not difficult, I figured out, not necessarily all right ah:    IE (Trident) kernel (ie for MAC, ies4linux, and so on, just consider Windows): Starts with "mozilla/" and contains "Windows NT" and "MSIE" strings;  Firefox (Gecko) kernel: with "mozilla/", the "firefox/" and "gecko/" strings are included, with the Android version of the "fennec/" string;  Opera () Kernel: "Opera /"The" presto/"string, with the iphone version also featuring" opera mini/", and the Android version with" Opera mobi/";  WebKit kernel:" mozilla/", containing" applewebkit/"and" safari/"string, which has" chrome/"is the Chrome browser, not with Safari or other;  above is the main browser kernel     The browser kernel is the key to solving compatibility problems, however, this compatibility issue has been solved by the framework of jquery and ExtJS, so this judgment is only used for individual page CSS styles with different kernel rendering effects, of course, It is also important to note that the same kernel renders different results on different devices, such as smartphones and computers.     3, awardThe actual application of the Useagent browser:    Different browser kernel to the page rendering effect is different, although already have jquery and ExtJS and so on for us to do the compatibility processing, but there will still be some small differences we need to deal with separately, At this point need to judge the browser kernel;  users and not only through the computer access to the site, with the increasing popularity of smartphones and tablets of the big line, the use of the two to the ratio of the Internet more and more high, how to do? The tablet is OK, the screen is high resolution, the smartphone is limited by his screen size and resolution, although it has strong processing power, it can support the existing website perfectly, but it's no harm to think more about the customer. After all, through the local scaling drag-and-drop to see the Web page is very uncomfortable, then, we can specifically for the iphone, Android, such as the narrow screen to provide a special version of the layout, one to enhance the browsing experience, and secondly reduce network traffic, speed of access to visit the speed of;  analysis Optimize the design of your Web site by identifying the customer browser type and documenting its number to enhance its customer experience separately     code as follows: <script type= "Text/javascript" >  var Sys = {};& nbsp var ua = navigator.userAgent.toLowerCase ();  var s;  (s = Ua.match (/msie ([D.] +)/)) ? sys.ie = S[1]:  (s = Ua.match (/firefox/([D.] +)/)) ? Sys.firefox = S[1]:  (s = Ua.match (/chrome/([D.] +)/)) ? Sys.chrome = S[1]:  (s = Ua.match (/opera. ( [D.] +)/)) ? Sys.opera = S[1]:  (s = Ua.match (/version/([D.] +). *safari/)? Sys.safari = s[1]: 0;   //below for testing   if (sys.ie) document.write (' ie: ' + sys.ie ');  if (Sys.firefox) doc Ument.write (' Firefox: ' + sys.firefox '); if (sys.chrome) document.write (' Chrome: ' + sys.chrome ');  if (Sys.opera) document.write (' Opera: ' + Sys.opera); &nbsp ; if (Sys.safari) document.write (' Safari: ' + Sys.safari ');  </script>  or:  Kindeditor Open Source Editor source code detection Browser method:  KE = {};  Ke.browser = (function () {  var ua = Navigator.userAgent.toLowerCa SE ();  return {  VERSION:ua.match (/(Msie|firefox|webkit|opera) [/:s] (d+)/)? Regexp.$2: "0",  IE: (Ua.indexof ("MSIE") >-1 && ua.indexof ("opera") = = 1),  GECKO: (Ua.indexof (" Gecko ") >-1 && ua.indexof (" khtml ") = = 1),  WEBKIT: (Ua.indexof (" AppleWebKit ") >-1),  OPERA: (UA . IndexOf ("opera") >-1)  }; }) ();