1

私のウェブサイトのテーマカラーとして次の色があります。

#0088cc;

bodyクラスを変更して、DOM / Webページ全体に適用されるすべての要素でこの色を別の色に置き換えるにはどうすればよいですか？

例えば。

if ($('body').hassClass('black')){
   replace all #0088cc with #000;
}

色は、境界線、背景、テキストの色など、すべての異なるhtml色を表します。

アップデート：

誰もが質問を正しく理解していないことがわかります。

メインテーマの色は＃0088ccです。現在、ボディ内のさまざまな要素は、テキストカラー、背景カラー、ボーダーカラーとしてこの色を持っています。そのため、ボディの子要素（その色が定義されているすべての要素）内のすべての色を新しい色に置き換えて、テーマ全体を変更したいと思います...

どうすればいいですか？

4

6 に答える 6

1 
if ($('body').hassClass('black')){

$(this).css("background","#000"); 
}
于 2013-03-25T11:20:30.803 に答える
1

このjquerycssスイッチャープラグインを使用して、さまざまなテーマを設定できます。 http://www.kelvinluck.com/assets/jquery/styleswitch/toggle.html

于 2013-03-25T11:26:20.603 に答える
1 
    var hexDigits = new Array
            ("0","1","2","3","4","5","6","7","8","9","a","b","c","d","e","f"); 

    //Function to convert hex format to a rgb color
    function rgb2hex(rgb) {
     rgb = rgb.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);
     return "#" + hex(rgb[1]) + hex(rgb[2]) + hex(rgb[3]);
    }

    function hex(x) {
      return isNaN(x) ? "00" : hexDigits[(x - x % 16) / 16] + hexDigits[x % 16];
     }
    $(document).ready(function(){
if ($('body').hassClass('black')){
        $("*").each(function(){
         if(rgb2hex($(this).css("color")) == "#0088cc")
                  $(this).css("color","black");
        });}
    });


Here the demo on jsFiddle http://jsfiddle.net/fAMAu/
于 2013-03-25T11:48:54.740 に答える
0

以下のコードは、blackクラスを持つすべての要素の色を黒に設定します。ただし、CSSでそれを設定するだけで、要素に別の色を適用することはできません。

  $.fn.replaceCss = function(properties,find,replaceWith, normalize) {
    find = normalize ? normalize(find) : find;
    return this.each(function(){
      var prop,
          self = $(this), 
          css = self.css(properties);

      for(prop in css){
         if(css.hasOwnProperty(prop)){
           val = normalize ? normalize(css[prop]) : css[prop]
           if(val == find){
             css[prop] = replaceWith;
           }
         }
      }
      self.css(css);
      return this;
    });
   };

そして、あなたはそれをこのように呼ぶことができます

$('.black').replaceCss(['color','background-color','another-color-property'],
                       "#0088cc",
                       "#000");

ただし、色は複数の形式で返される可能性があるため、最初に正規化することをお勧めします

    $('.black').replaceCss(['color','background-color','another-color-property'],
                       "#0088cc",
                       "#000",
                       function(val){
                          val = val.replace(/\s/g,"");
                          return val == "rgb(0,136,204)" ? "#0088cc" : val
                       });
于 2013-03-25T11:19:28.500 に答える
0 
    if ($('body').hasClass('black')){ //hope it is a standard hasClass method

      $(this).css("background","#000"); //replace all #0088cc with #000;

      //or for foreground
      $(this).css("color","#000"); //replace all #0088cc with #000;
    }
于 2013-03-25T11:19:37.547 に答える
0

これらすべてのcssプロパティを個別に追加する代わりに、これらすべてのプロパティを1つのcssクラスにまとめてから、addClass（）メソッド（必要に応じてremoveClass（））を使用してそのクラスを追加できます。

于 2013-03-25T11:35:44.873 に答える