Js css属性の設定


テキストリンク:https://www.cnblogs.com/LiuWeiLong/p/6058059.html
JSでCSSスタイルを動的に設定する(行内スタイルに設定する)には、次のようなものが一般的です.
 
1.styleのプロパティを直接設定する場合は、この設定を使用します!important値が無効です
属性に'-'号がある場合は、textAlignのようなアルパカの形に書きます.-号を保持したい場合は、カッコの形にelementします.style['text-align'] = '100px';
element.style.height = '100px';

2.属性を直接設定します(一部の属性にのみ使用でき、関連スタイルが自動的に認識されます).
element.setAttribute('height', 100);
element.setAttribute('height', '100px');

3.styleのプロパティの設定
element.setAttribute('style', 'height: 100px !important');

4.setPropertyを使用して設定する場合は!important、この方法で3番目のパラメータを設定することをお勧めします
element.style.setProperty('height', '300px', 'important');

5.JQなどのclassの変更classに関する方法を変更する
JSはcssの疑似要素を取得できないので、疑似要素の親のclassを変更することで、疑似要素のスタイルを動的に変更できます.
element.className = 'blue';
element.className += 'blue fb';

6.cssTextの設定
element.style.cssText = 'height: 100px !important';   //         
element.style.cssText += 'height: 100px !important';   //