Jak zmienić drugorzędny arkusz stylów za pomocą Jquery?

Question

Mam moje base.css i red.css na mojej stronie.

Chciałbym zmienić red.css na blue.css, gdy naciskam jakiś przycisk, bez utraty bazy.css jak to zrobić? Próbowałem to:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.0/jquery.min.js"></script> 

<script type="text/javascript"> 
    if($.cookie("css")) { 
    $("link").attr("href",$.cookie("css")); 
    } 
$(document).ready(function(){ 
    $("#troca_faccao").click(function() { 
     $(this).parent().find("#painel_faccao").slideDown('fast').show(); //Drop down the subnav on click 
     $(this).hover(function() { 
     }, function(){ 
      $(this).parent().find("#painel_faccao").slideUp('slow'); //When the mouse hovers out of the subnav, move it back up 
      }); 
     }) 
    $("#painel_faccao li a").click(function() { 
     $("link").attr("href",$(this).attr('rel')); 
     $.cookie("css",$(this).attr('rel'), {expires: 365, path: '/'}); 
    return false; 
    }); 
}); 
</script> 

i Gr:

     <div id="painel_faccao" style="display: none"> 
         <p>A Escolha é Sua!</p> 
         <ul> 
          <li class="horda"><a href="#" rel="horde.css">HORDA</a></li> 
          <li class="alianca"><a href="#" rel="aliance.css">ALIANÇA</a></li> 
         </ul></div> 

Answer 1

Można użyć :eq przełącznik filtra lub eq() sposób kierować stylów chcesz:

$("link:eq(0)").attr("href",$(this).attr('rel')); 

Określ pozycję na eq dla arkusza stylów, który chcesz zmienić href. Off Oczywiście chcesz zmienić href łącza arkusza wskazując red.css i nie base.css

---

Alternatywnie, można zastosować id do łącza arkusza stylów chcesz zmienić href OFL

<link id="someID"............/> 

I później:

$("link#someID").attr("href",$(this).attr('rel')); 

Answer 2

http://www.cssnewbie.com/simple-jquery-stylesheet-switcher/

tl; dr:

Gdzieś w HTML:

<link id="styles" rel="stylesheet" type="text/css" href="red.css" /> in HTML 

Gdzieś w jQuery:

$("#styles").attr("href","blue.css");