Qraft(クラフト) 資格・学習クイズアプリ

React入門 練習問題 17:JSX:属性の命名規則

ReactのJSXで、HTML要素にCSSクラスを指定する際に使用する正しい属性名はどれか。

  1. class
  2. className
  3. classId
  4. htmlClass
  5. classFor
正解と解説を見る
正解:className

JSXではJavaScriptの予約語との衝突を避けるため、CSSクラスの指定にはclassNameという属性名を使用する。

【正解の理由】
JSXは最終的にJavaScriptの関数呼び出しに変換されるため、JavaScriptの予約語である「class」(クラス定義に使う構文)をそのまま属性名として使うことができない。そのためReactでは代わりに「className」という専用の属性名を用意しており、レンダリング時に実際のDOM要素のclass属性へと変換される。

【不正解の理由】
• 「class」:JavaScriptの予約語と衝突するため、JSXの属性名としては使用できない
• 「classId」:Reactで定義されている実際の属性名ではなく、架空の名称である
• 「htmlClass」:Reactで定義されている実際の属性名ではなく、架空の名称である
• 「classFor」:Reactで定義されている実際の属性名ではなく、架空の名称である

← 前の問題問題一覧次の問題 →
アプリで解いてレーティングを上げる(無料・登録不要)