ボディクラスとしてのブラウザとOS

Question

ボディクラスにはOSとブラウザがあります。フォントはさまざまなOS /ブラウザ設定で同じように動作しないので、私はpixelperfectスタイリングに必要です。いくつかのグーグルと実験の後。私はこれを行うに考えることができる唯一の方法は、

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'; 

が、私はそのことに非常にbeautyfulソリューションを考える...のindexOfを使用することでした。これを行う正規表現はありますか？または、これを行うより速い方法がありますか？

Answer 1

正規表現を使用することもできますが、それはそれほど美しくはありません。

基本的にブラウザ/ os/versionのユーザーエージェント文字列をスキャンすると、は決してになります。これは非常にあなたに、上記と同様のクラスを与えるものではありませんが、十分に異なるOSやブラウザを区別するために

// 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]); 
}; 

ここ

何かjQueryを使って少しきれいです...。

たとえば、あなたがして...ブラウザの情報のため

body.windows.mozilla { 
    background: blue; 
} 

See it!

Or use a plugin.

Answer 2

Windows上のFirefoxをターゲット可能性があり、jQueryのを使用している場合、$.browser

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