2016-08-18 6 views
-1

オブジェクトの色を変更する方が効率的な方法はどれですか?私は要素要素の色を動的に変更する最適な方法

1)要素、それがロードされるjQueryを使ってクラスを追加することを使用しますたとえば は(すでにあるかもしれない他の色)

var element = $('div'); 
 
element.removeClass("red"); 
 
element.removeClass("blue"); 
 
element.removeClass("green"); 
 

 
var newColor = "red green or blue"; 
 
element.addClass(newColor);
<div></div>

2を削除します)色のフィールドを追加し、CSSセレクターを使って確認してください。

どちらが良いですか? 私が言及しなかったより良い方法はありますか? ありがとうございました!

+3

は... –

+0

を「最高」の定義これはあまりにも広い質問ですが、私はDOMの上に必要な過負荷として使用する2番目の方法をお勧めします –

+0

別々の懸念から、スタイリングは要素のクラス名を変更することによって変更する必要があります。新しく作成された要素にはまだクラスがないので、新しく作成したdivから3色を削除する必要はありません。また、classNameを空の文字列に設定すると、同時に要素からすべてのクラスを削除できます。スタイリングのデータ属性はちょうど奇妙に見えます。なぜなら基本的には、どのクラスがやるべきかを再現しているからです。そして、インラインスタイルは、電子メールのように、常に最後の手段であるべきです。 (懸念の分離、容易な将来の再構成などのために) – Shilly

答えて

2

どちらの方法は、かなり同じですが、私が考えている最初のオプションは、カスタム属性やクラスをいじりされていませんが、直接、インラインスタイルを変える:

var el = $('el') 
el.css('background-color', '#FF0000') 
関連する問題