Judgment principle:
JavaScript is the main language for front-end development. We can determine the type and version of the browser by writing JavaScript programs. There are generally two methods for JavaScript to determine the browser type. One is based on the unique attributes of various browsers, and the other is determined by analyzing the userAgent attribute of the browser. In many cases, after the browser type is determined by value, the browser version needs to be determined to handle compatibility issues, and the browser version can generally only be known by analyzing the browser's userAgent.
Browser type
⑴ Browser-specific attributes
⑵According to userAgent
Browser version
⑴According to userAgent
Judgment for mobile browsers
1. How to determine whether it is a mobile terminal using regular match?
Match whether navigator.userAgent contains the string AppleWebKit*****Mobile
Android qq browser HD version only has AppleWebKit
2. Judgment of mobile phone language version
Use navigator.browserLanguage to get the windows phone language version.
Of course, the language version of the hateful little mobile phone also has compatibility differences. Browsers that are compatible with Mozilla and Apple WebKit kernels will list navigator.language when accessing its language version.
CODE:
Copy the code code as follows:
<script type="text/javascript">
var browser={
versions:function(){
var u = navigator.userAgent, app = navigator.appVersion;
return { //Mobile terminal browser version information
trident: u.indexOf('Trident') > -1, //IE kernel
presto: u.indexOf('Presto') > -1, //opera kernel
webKit: u.indexOf('AppleWebKit') > -1, //Apple, Google kernel
gecko: u.indexOf('Gecko') > -1 && u.indexOf('KHTML') == -1, //Firefox kernel
mobile: !!u.match(/AppleWebKit.*Mobile.*/), //Whether it is a mobile terminal
ios: !!u.match(//(i[^;]+;( U;)? CPU.+Mac OS X/), //ios terminal
android: u.indexOf('Android') > -1 || u.indexOf('Linux') > -1, //android terminal or uc browser
iPhone: u.indexOf('iPhone') > -1 , //Whether it is iPhone or QQHD browser
iPad: u.indexOf('iPad') > -1, //Whether it is iPad
webApp: u.indexOf('Safari') == -1 //Whether the web should be a program without header and bottom
};
}(),
language:(navigator.browserLanguage || navigator.language).toLowerCase()
}
document.writeln("language version: "+browser.language);
document.writeln(" Whether it is a mobile terminal: "+browser.versions.mobile);
document.writeln(" ios terminal: "+browser.versions.ios);
document.writeln(" android terminal: "+browser.versions.android);
document.writeln(" Whether it is iPhone: "+browser.versions.iPhone);
document.writeln(" Whether iPad: "+browser.versions.iPad);
document.writeln(navigator.userAgent);
</script>
A rather special place
UC Browser does not have an Android header and only returns: linux. Here, it is roughly judged to be Android based on Linux (the prerequisite must be a mobile terminal, which UC is satisfied with)
The detection results of Android QQ Browser HD version are: mac, Safari