JavaScriptで複数のプロパティをスタイル設定する方法

要素を選択する: HTML要素をJavaScriptで選択します。一般的な方法としては、document.getElementById()やdocument.querySelector()を使用します。例えば、idが"myElement"の要素を選択する場合は、以下のようなコードを使用します:
```
const element = document.getElementById("myElement");
```
スタイルプロパティを設定する: element.styleオブジェクトを使用して、要素のスタイルプロパティを設定します。複数のプロパティを一度に設定するには、element.style.propertyName = valueの形式を使用します。例えば、背景色とフォントサイズを同時に設定する場合は、以下のようなコードを使用します:
```
element.style.backgroundColor = "red";
element.style.fontSize = "16px";
```
クラスを使用する: スタイルの再利用性を高めるために、CSSクラスを定義して使用する方法もあります。CSSでスタイルを定義し、JavaScriptで要素にクラスを追加することで、簡潔なコードとなります。以下の手順に従ってください。
- CSSでスタイルを定義します。例えば、クラス名が"myClass"で背景色が赤のスタイルを定義する場合は、以下のようなCSSを作成します:
```
.myClass {
background-color: red;
}
```
- JavaScriptで要素にクラスを追加します。例えば、idが"myElement"の要素に"myClass"クラスを追加する場合は、以下のようなコードを使用します:
```
element.classList.add("myClass");
```

これらの手法を使用することで、JavaScriptで複数のプロパティをスタイル設定することができます。効率的で再利用可能なコードを実現し、柔軟なスタイルの変更が可能となります。