使用JQUERY添加/删除css文件 [英] adding / removing css Files using JQUERY

问题描述

美好的一天！

我想根据列表的大小添加和删除CSS文件。
我的代码如下：

  $（＃size_storedList $ b var list_size = $（＃size_storedList）。attr（'value'）; 
 if（list_size <= 4）{
 if（$（link）。 size5'））{
 $（'link.size5'）。removeClass（）; 
} 
 if（$（link）。is（'。size6'））{
 $（'link.size6'）。removeClass（）; 
} 
 $（'head'）。append（'< link class =size4 =stylesheethref = css / stored_list / list_size4.csstype =text / css/>'）; 
} else if（list_size == 5）{
 if（$（link）。 （'.size4'））{
 $（'link.size4'）。removeClass（）; 
} 
 if（$（link）。is（'。size6'） ）{
 $（'link.size6'）。removeClass（）; 
} 
 $（'head'）。append（'< link class =size5 =stylesheet href =css / stored_list / list_size5.csstype =text / css/>'）; 
} else if（list_size == 6）{
 if ）.is（'。size4'））{
 $（'link.size4'）。removeClass（）; 
} 
 if（$（link）。is（'。siz5'））{
 $（'link.size5'）。removeClass 
} 
 $（'head'）。append（'< link class =size6 =stylesheethref =css / stored_list / list_size6.csstype =text / css />'）; 
} 
}）; 
  

但它是一个杂乱。

  if（$（链接）。是（'。size5'））{
 $（'link.size5'）。removeClass（）; 
} 
  

谢谢。

解决方案

 < link rel =stylesheethref =default.csstype =text / css> 
 
< ul> 
< li>< a id =css-redhref =＃red>红色< / a>< / li& 
< li>< a id =css-bluehref =＃blue>蓝色< / a>< / li& 
< li>< a id =css-greenhref =＃green>绿色< / a>< / li> 
< / ul> 
 
 $（document）.ready（function（）{
 // red 
 $（＃css-red）。 $（link [rel = stylesheet]）。attr（{href：red.css}）; 
}）; 
}）;上面的概念不同于你，但我认为这将是一个好主意。您可以自定义与当前代码相同。
 
Good day!

I want to add and remove CSS files according to the size of the list.
My code is as follow:
$("#size_storedList").ready(function(){
    var list_size = $("#size_storedList").attr('value');
    if(list_size <= 4){
        if ($("link").is('.size5')){
            $('link.size5').removeClass();
        }
        if ($("link").is('.size6')){
            $('link.size6').removeClass();
        }
        $('head').append('<link class="size4" rel="stylesheet" href="css/stored_list/list_size4.css" type="text/css" />');
    } else if(list_size == 5){
        if ($("link").is('.size4')){
            $('link.size4').removeClass();
        }
        if ($("link").is('.size6')){
            $('link.size6').removeClass();
        }
        $('head').append('<link class="size5" rel="stylesheet" href="css/stored_list/list_size5.css" type="text/css" />');
    } else if(list_size == 6){
        if ($("link").is('.size4')){
            $('link.size4').removeClass();
        }
        if ($("link").is('.siz5')){
            $('link.size5').removeClass();
        }
        $('head').append('<link class="size6" rel="stylesheet" href="css/stored_list/list_size6.css" type="text/css" />');
    }
});
But it is kind of messy. What can i do to minimize the checking if the file already exists or not so that i can remove it
if ($("link").is('.size5')){
            $('link.size5').removeClass();
}
Thank you.
解决方案
<link rel="stylesheet" href="default.css" type="text/css">

<ul>
  <li><a id="css-red" href="#red">Red</a></li>
  <li><a id="css-blue" href="#blue">Blue</a></li>
  <li><a id="css-green" href="#green">Green</a></li>
</ul>

$(document).ready(function() {
  // red
  $("#css-red").click(function() {
    $("link[rel=stylesheet]").attr({href : "red.css"});
  });
});
Above concept is different from you, but I think this will be a good idea. You can customize same to your current code.

                        
这篇关于使用JQUERY添加/删除css文件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！