Как вызвать разные CSS для соответствующих браузеров, таких как использование JQuery

Question

Это уже спрашивается как вызвать конкретный CSS для конкретного браузера, используя jquery

Я хочу использовать один CSS-файл для сафари, другой для Mozilla и другой для IE

Answer 1

Вы, вероятно, должны делать это на стороне сервера (или даже лучше, совсем нет). Но если вы не хотите делать это на стороне клиента, вам нужно что-то вроде этого.

var writeStyleSheet = function(url){
    var linkTag = document.createElement('link');
    linkTag.type = 'text/css';
    linkTag.rel = 'stylesheet';
    linkTag.href = url;
    linkTag.media = 'screen';
    document.getElementsByTagName("head")[0].appendChild(linkTag);
}
if(jQuery.brwoser.msie){
    writeStyleSheet('ie.css');
}
else if(jQuery.browser.safari){
    writeStyleSheet('safari.css');
}
else if(jQuery.browser.mozilla){
    writeStyleSheet('mozalla.css');
}

Обратите внимание, что jQuery.browser устарела в версии 1.3. Вы должны создать таблицу стилей, которая работает во всех браузерах. Возможно добавить некоторые условные комментарии для определенных хаков IE:

 <!--[if IE]>
  <link type='text/css' href='ieHacks.css' rel='stylesheet' />
 <![endif]-->     

Answer 2

вы можете обнаружить браузер, используя объект $ .browser.

чтобы получить требуемую таблицу стилей, которую я получил из этой записи в блоге

$(document).ready(function() {
    $("a").click(function() {
        $('head').append('<link rel="stylesheet" href="style2.css" 
         type="text/css" />');
    });
});

вот еще один хороший пост Kelvin Luck , в котором описывается замена и применение стилей динамически с использованием jquery.

Answer 3

Вы можете прослушать браузер, а затем создать элемент link и добавить его к тегу head.

if(jQuery.browser.msie)
    $('head').append('<link href="css/ie.css" rel="stylesheet" />');
... // and so on.

РЕДАКТИРОВАТЬ: ссылка для jQuery.browser .