How can you detect the version of a browser?
You can see what the browser says, and use that information for logging or testing multiple browsers.
navigator.sayswho= (function(){ var ua= navigator.userAgent, tem, M= ua.match(/(opera|chrome|safari|firefox|msie|trident(?=\/))\/?\s*(\d+)/i) || []; if(/trident/i.test(M[1])){ tem= /\brv[ :]+(\d+)/g.exec(ua) || []; return 'IE '+(tem[1] || ''); } if(M[1]=== 'Chrome'){ tem= ua.match(/\b(OPR|Edge)\/(\d+)/); if(tem!= null) return tem.slice(1).join(' ').replace('OPR', 'Opera'); } M= M[2]? [M[1], M[2]]: [navigator.appName, navigator.appVersion, '-?']; if((tem= ua.match(/version\/(\d+)/i))!= null) M.splice(1, 1, tem[1]); return M.join(' ');})();console.log(navigator.sayswho); // outputs: `Chrome 62`
This is an improvement on Kennebec's answer.
function get_browser() { var ua=navigator.userAgent,tem,M=ua.match(/(opera|chrome|safari|firefox|msie|trident(?=\/))\/?\s*(\d+)/i) || []; if(/trident/i.test(M[1])){ tem=/\brv[ :]+(\d+)/g.exec(ua) || []; return {name:'IE',version:(tem[1]||'')}; } if(M[1]==='Chrome'){ tem=ua.match(/\bOPR|Edge\/(\d+)/) if(tem!=null) {return {name:'Opera', version:tem[1]};} } M=M[2]? [M[1], M[2]]: [navigator.appName, navigator.appVersion, '-?']; if((tem=ua.match(/version\/(\d+)/i))!=null) {M.splice(1,1,tem[1]);} return { name: M[0], version: M[1] }; }var browser=get_browser(); // browser.name = 'Chrome' // browser.version = '40'console.log(browser);This way you can shield yourself from the obscurity of the code.
Here are several prominent libraries that handle browser detection as of May 2019.
Bowser by lancedikson - 3,761★s - Last updated May 26, 2019 - 4.8KB
var result = bowser.getParser(window.navigator.userAgent);console.log(result);document.write("You are using " + result.parsedResult.browser.name + " v" + result.parsedResult.browser.version + " on " + result.parsedResult.os.name);<script src="https://unpkg.com/bowser@2.4.0/es5.js"></script>*supports Edge based on Chromium
Platform.js by bestiejs - 2,250★s - Last updated Oct 30, 2018 - 5.9KB
console.log(platform);document.write("You are using " + platform.name + " v" + platform.version + " on " + platform.os);<script src="https://cdnjs.cloudflare.com/ajax/libs/platform/1.3.5/platform.min.js"></script>jQuery Browser by gabceb - 504★s - Last updated Nov 23, 2015 - 1.3KB
console.log($.browser)document.write("You are using " + $.browser.name + " v" + $.browser.versionNumber + " on " + $.browser.platform);<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-browser/0.1.0/jquery.browser.min.js"></script>Detect.js (Archived) by darcyclarke - 522★s - Last updated Oct 26, 2015 - 2.9KB
var result = detect.parse(navigator.userAgent);console.log(result);document.write("You are using " + result.browser.family + " v" + result.browser.version + " on " + result.os.family);<script src="https://cdnjs.cloudflare.com/ajax/libs/Detect.js/2.2.2/detect.min.js"></script>Browser Detect (Archived) by QuirksMode - Last updated Nov 14, 2013 - 884B
console.log(BrowserDetect)document.write("You are using " + BrowserDetect.browser + " v" + BrowserDetect.version + " on " + BrowserDetect.OS);<script src="https://kylemit.github.io/libraries/libraries/BrowserDetect.js"></script>Notable Mentions:
- WhichBrowser - 1,355★s - Last updated Oct 2, 2018
- Modernizr - 23,397★s - Last updated Jan 12, 2019 - To feed a fed horse, feature detection should drive any canIuse style questions. Browser detection is really just for providing customized images, download files, or instructions for individual browsers.