このページはコミュニティーの尽力で英語から翻訳されました。MDN Web Docsコミュニティーについてもっと知り、仲間になるにはこちらから。
Element: className プロパティ
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since 2015年7月.
className はElement インターフェイスのプロパティで、この要素のclass 属性の値を取得したり設定したりします。
値
文字列変数で、現在の要素のクラスまたは空白区切りのクラス群を表します。
例
js
const el = document.getElementById("item");el.className = el.className === "active" ? "inactive" : "active";メモ
このプロパティでは、className という名前がclass の代わりに使用されています。これは DOM を操作するために使用される多くの言語と "class" キーワードが競合するためです。
className はSVGAnimatedString のインスタンスにも、element がSVGElement であれば存在する可能性があります。 SVG 要素を扱っている場合は、要素のclassName はElement.getAttribute やElement.setAttribute を使用して取得したり設定したりした方がいいでしょう。しかし、その要素のclass 属性が空であった場合、Element.getAttribute は"" ではなくnull を返すことに注意してください。
js
elm.setAttribute("class", elm.getAttribute("class"));メモ:class はHTML 属性であり、className はDOM プロパティです。
仕様書
| Specification |
|---|
| DOM # ref-for-dom-element-classname① |