JavaScriptを使用してCSSクラスモデルを変更する

Question

JavaScriptを使用してCSSクラスモデルを変更することは可能ですか？

擬似コード：

function updateClass(className, newData) { 
    cssInterface.alterClass(className, newData); 
} 

クラス名（「.footer」のように）変更されることになっているクラスの名前であることとあるnewDataがボーダーのような新しいクラスのコンテンツ（あること：「1pxのソリッドピンク; "）。

対象は実際にはスペースを節約することです：私はCSS3アニメーションで作業していますので、クラスの影響を受ける要素の属性を変更すると、そのアニメーションが終了します。大文字と小文字）のフォントサイズはもう変更されません。異なるクラスを使用するには、影響を受けるすべての要素に対して新しいクラスセットが必要です。これを避けたいと思います。私は

element.className = "foo"; 

または

element.style.fontSize = "15pt"; 

経由での変更のためにあなたの助けのおかげで、みんな:)

Answer 1

私の答えはhereです。あなたの質問に答える：はい、可能です。

@ CSS3：私はhtml5のいずれかの実験で全く同じことを試みました。 <style>要素を追加し、contentTextを必要なCSSクラス定義に変更しました。もちろんcssRuleオブジェクトはここで（例）と呼ばれ

function changeCSS(typeAndClass, newRule, newValue)  // modify the site CSS (if requred during scaling for smaller screen sizes) 
{ 
    var thisCSS=document.styleSheets[0]         // get the CSS for the site as an array 
    var ruleSearch=thisCSS.cssRules? thisCSS.cssRules: thisCSS.rules // work out if the browser uses cssRules or not 
    for (i=0; i<ruleSearch.length; i++)         // for every element in the CSS array 
    { 
     if(ruleSearch[i].selectorText==typeAndClass)     // find the element that matches the type and class we are looking for 
     { 
      var target=ruleSearch[i]         // create a variable to hold the specific CSS element 
      var typeExists = 1; 
      break;              // and stop the loop 
     } 
    } 
    if (typeExists) 
    { 
     target.style[newRule] = newValue;         // modify the desired class (typeAndClass) element (newRule) with its new value (newValue). 
    } 
    else 
    { 
     alert(typeAndClass + " does not exist."); 
    } 
} 

...これを行うには、私の機能です

Answer 2

を検索するわけではない

あなたは道場を見てみなければならない、それはいくつかを持っていますあなたはそれを行うことができる素敵な機能..

私の知る限りは、オブジェクトモデルは簡単にあなたがすでに特定のクラスのための既存のスタイルルールを持っているかどうかを伝えることはできませんが、あなたは簡単にそのクラスの新しいルールを追加することができ、それがいずれかをオーバーライドするCSSを伝えることができるよう

http://dojotoolkit.org/reference-guide/1.7/dojo/addClass.html

Answer 3

そのスタイルの以前の宣言。

creating dynamic stylesheetsの例が見つかりました。

Answer 4

:-)ずっときれいになり、このことができます

changeCSS("div.headerfixed","-moz-transform-origin", "100% 0%"); 

希望を変更します。