¿Cómo se puede detectar la versión de un navegador?

He estado buscando un código que me permita detectar si el usuario que visita el sitio web tiene Firefox 3 o 4. Todo lo que encontré es un código para detectar el tipo de navegador, pero no la versión.

¿Cómo puedo detectar la versión de un navegador como este?

May 07 '11 03:05 odle

Esta es una mejora con respecto a la respuesta de Kennebec.

mbrowser=function(){
    this.spec_string=   navigator.userAgent;
    this.name=          this.get_name();
    this.version=       this.get_version();
    };

mbrowser.prototype.get_name=function(){
    var spec_string=this.spec_string;

    var matches=spec_string.match(/(opera|chrome|safari|firefox|msie|trident(?=\/))\/?\s*(\d+)/i) || [];
    
    // Work with the matches.
    matches=matches[2]? [matches[1], matches[2]]: [navigator.appName, navigator.appVersion, '-?'];
        
    // Trident.
    if(/trident/i.test(matches[1])){
        var temp=/\brv[ :]+(\d+)/g.exec(spec_string) || [];
        return 'IE';
        }
    
    // Chrome.
    if(matches[1]==='Chrome'){
        var temp=spec_string.match(/\bOPR|Edge\/(\d+)/)
        if(temp!=null)   {return 'Opera';}
        }   

    if((temp=spec_string.match(/version\/(\d+)/i))!=null){
        matches.splice(1,1,temp[1]);
        }
                                                                                                                       
    var name=matches[0];

    return name;
    };


mbrowser.prototype.get_version=function(){
    var spec_string=this.spec_string;

    var matches=spec_string.match(/(opera|chrome|safari|firefox|msie|trident(?=\/))\/?\s*(\d+)/i) || []; 

    // Work with the matches.
    matches=matches[2]? [matches[1], matches[2]]: [navigator.appName, navigator.appVersion, '-?'];

    // Trident.
    if(/trident/i.test(matches[1])){
        var temp=/\brv[ :]+(\d+)/g.exec(spec_string) || []; 
        var version=(temp[1]||'');
        return version;
        }   

    // Chrome.
    if(matches[1]==='Chrome'){
        var temp=spec_string.match(/\bOPR|Edge\/(\d+)/)
        var version=temp[1];
        if(temp!=null)   {return version;}
        }   

    if((temp=spec_string.match(/version\/(\d+)/i))!=null){
        matches.splice(1,1,temp[1]);                                                                                   
        }

    var version=matches[1];

    return version;
    };

// m=module.
var browser=new mbrowser();
console.log(browser.name);    // Chrome
console.log(browser.version); // 109

Este código deduce el nombre y el número del navegador a partir de spec_string (navigator.userAgent). Pero existen todo tipo de spec_strings con su respectivo nombre y número de navegador. Y no estoy en condiciones de comprobar más que una pequeña proporción de ellos. Sería fantástico si pudieras publicar una cadena de especificación cuyo nombre y número de navegador resultante conozcas. Luego puedo actualizar el código en consecuencia.

Luego, lentamente crearía una lista de elementos spec_string de la siguiente manera.

'spec_string1'=>[name,number],
'spec_string2'=>[name,number],

Luego, en el futuro, cada vez que se realice un cambio en el código, se podrá probar automáticamente en todas las conversiones spec_string conocidas.

Podemos hacerlo juntos.

Jun 05 '2013 11:06 john-jones

Aquí hay varias bibliotecas destacadas que manejan la detección del navegador a partir de mayo de 2019.

Bowser por lancedikson - 3,761★s - Última actualización 26 de mayo de 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/[email protected]/es5.js"></script>

*soporta Edge basado en Chromium

Platform.js por bestiejs - 2250★s - Última actualización el 30 de octubre de 2018 - 5,9 KB

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>

Navegador jQuery de gabceb - 504★s - Última actualización el 23 de noviembre de 2015 - 1,3 KB

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 (Archivado) por darcyclarke - 522★s - Última actualización el 26 de octubre de 2015 - 2,9 KB

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>

Detección del navegador (archivado) por QuirksMode - Última actualización el 14 de noviembre de 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>

Menciones destacadas:

• WhichBrowser - 1,355★s - Última actualización el 2 de octubre de 2018
• Modernizr - 23,397★s - Última actualización el 12 de enero de 2019 - Para alimentar a un caballo alimentado, la detección de características debería generar cualquier pregunta sobre el estilo del canIuse . La detección del navegador en realidad sirve solo para proporcionar imágenes personalizadas, archivos de descarga o instrucciones para navegadores individuales.

Otras lecturas

• Desbordamiento de pila : ¿detección del navegador en JavaScript?
• Desbordamiento de pila : ¿Cómo detectar los navegadores Safari, Chrome, IE, Firefox y Opera?

Mar 30 '2018 23:03 KyleMit

Esto combina la respuesta de Kennebec (K) con la respuesta de Hermann Ingjaldsson (H):

• Mantiene el código mínimo de la respuesta original. (K)
• Funciona con Microsoft Edge (K)
• Extiende el objeto del navegador en lugar de crear una nueva variable/objeto. (K)
• Separa la versión y el nombre del navegador en objetos secundarios independientes. (H)

    navigator.browserSpecs = (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 {name:'IE',version:(tem[1] || '')};
        }
        if(M[1]=== 'Chrome'){
            tem = ua.match(/\b(OPR|Edge)\/(\d+)/);
            if(tem != null) return {name:tem[1].replace('OPR', 'Opera'),version:tem[2]};
        }
        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]};
    })();

    console.log(navigator.browserSpecs); //Object { name: "Firefox", version: "42" }

    if (navigator.browserSpecs.name == 'Firefox') {
        // Do something for Firefox.
        if (navigator.browserSpecs.version > 42) {
            // Do something for Firefox versions greater than 42.
        }
    }
    else {
        // Do something for all other browsers.
    }

Jun 28 '2016 15:06 Brandon