浏览器和操作系统作为正文类

我想在body类中使用操作系统和浏览器。 我需要用于像素完美样式，因为字体在不同的OS /浏览器配置中的行为方式不同。 经过一些谷歌搜索和实验。 我能想到的唯一方法是使用indexOf …

var OSName="Unknown OS"; if (navigator.appVersion.indexOf("Win")!=-1) OSName="Windows"; if (navigator.appVersion.indexOf("Mac")!=-1) OSName="MacOS"; if (navigator.appVersion.indexOf("X11")!=-1) OSName="UNIX"; if (navigator.appVersion.indexOf("Linux")!=-1) OSName="Linux"; var agt=navigator.userAgent.toLowerCase(); if (agt.indexOf("opera") != -1) return 'Opera'; if (agt.indexOf("firefox") != -1) return 'Firefox'; if (agt.indexOf("safari") != -1) return 'Safari'; if (agt.indexOf("webkit") != -1) return 'Webkit'; if (agt.indexOf("msie") != -1) return 'Internet Explorer'; if (agt.indexOf("mozilla/5.0") != -1) return 'Mozilla'; 

我认为这不是一个非常美丽的解决方案。 是否有一些正则表达式可以做到这一点？ 或者有更快的方法吗？

Answer 1

你可以使用正则表达式，但它不会让它更漂亮。

基本上，扫描浏览器/操作系统/版本的用户代理字符串永远不会很漂亮。

这是jQuery有点漂亮的东西……

 // Add some classes to body for CSS hooks // Get browser $.each($.browser, function(i) { $('body').addClass(i); return false; }); // Get OS var os = [ 'iphone', 'ipad', 'windows', 'mac', 'linux' ]; var match = navigator.appVersion.toLowerCase().match(new RegExp(os.join('|'))); if (match) { $('body').addClass(match[0]); }; 

这并没有给你提供与上面相同的类，但足以区分不同的操作系统和浏览器。

例如，您可以在Windows上使用…

 body.windows.mozilla { background: blue; } 

看见！

或者使用插件。

Answer 2

对于浏览器信息，如果使用jQuery，则有$.browser

http://api.jquery.com/jQuery.browser/