テーマに応じてCSSを変更し、以前のテーマを削除してください。

Question

私は、ユーザーの選択に従ってテーマのCSSファイルを追加し、以前に選択したtheme.cssファイルを削除する機能があります。私はこのコードを書いた

var previousTheme="theme1"; 
var show='theme1'; 
$(document.body).on('change', '#selecttheme', function() { 
    show = $("option:selected", this).data('show'); 
    $("#hue-demo-bg-div").fadeToggle("3000", function(){ 
     $("#hue-demo-bg-div").removeClass(previousTheme).addClass(show).css('background-color',""); 
     $(document.head).find('#themecss').attr("href","/assets/css/"+show+".css"); 
     $('#heading_preview').css('color',""); 
     $('#description_preview').css('color',""); 
     $('#btn_text_preview').css('color',""); 
     $('#hue-demo-link-div').css('background-color',""); 
     $('#paragraph_preview').css('color',""); 
     $('#decline_preview').css('color',""); 
     $('#leadsnowheader').css('background-color',""); 
    }); 
    previousTheme=show; 
    $("#hue-demo-bg-div").fadeToggle("3000", function(){ 
     loadColorValues(); 
    }); 
}); 

このコードはlocalhostでうまくいきます。サーバー上では正しく動作しません。 CSSの読み込みには多くの時間がかかります。任意のヘルプやこのコードの改善..？

Answer 1

すべてを平易なJavaScriptで書き換えます。その後、ファイルを小さくします。また、ロードする必要のあるすべてのCSSファイルを縮小します。また、.change(function(){});は.on('change', function() {});

よりも高速である私はvariablesにすべてのものを入れたときに、それは読みやすさを向上させる知っているが、variablesは時間が減少見つけるために、要素のシステムをループしjQueryをさせます。

これに影響を与える可能性のあるサーバー側には、多くの要因があります。私はどこから始めるべきかわからない...