Aún a las alturas que estamos y con la madurez de la red, seguimos teniendo un alto nivel de incompatibilidad entre los navegadores, lo cual nos obliga a tener código JavaScript o CSS adhoc para las diferentes plataformas.
Es por ello que nos puede ser interesante conocer el nombre y la versión del navegador que está ejecutando nuestra página. Para ello podemos basarnos en el objeto navigator, el cual representa a nuestro navegador, y acceder a sus propiedades.
Recuperar el nombre del navegador del objeto navigator puede resultar engorroso. Y es que aunque posee una propiedad .appName, esta no viene a reflejar muy claramente el nombre de nuestro navegador. Y si le echamos un ojo a la propiedad veremos que devuelve Netscape o Microsoft Internet Explorer. Con lo cual, los Safari, Chrome,… y compañía no podrán ser detectados.
document.write("Nombre del navegador: " + navigator.appName);
Con la versión nos pasa algo parecido. En este caso tenemos la propiedad .appVersion. Si bien esta nos devolverá valores de 4 o 5. Asociados a los navegadores NetScape y Microsoft. Bueno, y una ristra de valores con compatibilidades y el nombre del sistema operativo.
document.write("Versión del navegador: " + navigator.appVersion);
Es por ello que para conocer el nombre y la versión del navegador lo mejor es utilizar la propiedad .userAgent, la cual nos proporciona, no solo, información del nombre y la versión del navegador, si no que también nos da nombres del sistema operativo sobre el que ejecutamos, información de compatibilidades,….
document.write("Nombre y versión del navegador: " + navigator.userAgent);
El resultado que obtendremos será algo parecido a lo siguiente:
Mozilla/5.0 (Windows; U; Windows NT 5.1; es-ES) AppleWebKit/525.19 (KHTML, like Gecko) Version/3.1.2 Safari/525.21