私はいくつかのdiv
要素を作成するJavaScriptコードをいくつか持っており、CSSプロパティを設定しています。 JavaScriptコードからCSSロジックを切り離したいので、CSSは独自の.css
ファイルで読みやすくなっているので、私の要素のCSS className
を設定し、定義されたCSSプロパティにいくつかの値を動的に注入したいと思います。ここでJavaScriptでCSSを動的に設定および変更する方法は?
は私がやりたいものです。
style.css
:
.myClass {
width: $insertedFromJS
}
script.js
:
var myElement = document.createElement("div");
myElement.className = "myClass";
私はこのような何かをしたいが、その時点でmyElement.style.width
が空である
myElement.style.width.replaceAll("$insertedFromJS", "400px");
私の問題は、myElement.className = "myClass"
の呼び出し後、CSSがまだ適用されていないことです。
いつJSを実行していますか?すぐに? 'onload'? 'ondocumentready'? – mwcz
私は少し質問に混乱しています。クラスmyClassを持つすべての要素や作成した要素だけに影響を与えようとしていますか? –
私はジェームズと一緒にこの1つです。質問に答えて、それを再読した後、私は実際にこのようなものの目的がどんなものであろうと混乱しています。 Javascriptコードにハードコードする正しい値を挿入/置換するためにJavaScriptに依存するCSSスタイルシートを作成して、JSとCSSを「デカップル」する必要がありますか?それは、「デカップル」という言葉の意味とはまったく正反対です。 – streetlogics