Element: toggleAttribute() メソッド

構文

toggleAttribute(name)
toggleAttribute(name, force)

引数

name

文字列で、トグル切り替えしたい属性の名前を指定します。HTML 文書内の HTML 要素に対して toggleAttribute() が呼び出されるとばれると、属性名は自動的に全て小文字に変換されます。

force 省略可

論理値で、以下の効果があります。

• 指定されなかった場合、 toggleAttribute メソッドは name という名前の属性を「トグル切り替え」します。 — 存在すれば取り除き、存在しなければ追加します。
• true であった場合、 toggleAttribute メソッドは、 name という名前の属性を追加します。
• false であった場合、 toggleAttribute メソッドは name という名前の属性を取り除きます。

返値

name という属性が存在する状態になれば true、そうでなければ false となります。

例外

InvalidCharacterError DOMException

指定された属性 name に、属性名として無効な文字が 1 文字以上含まれています。

例

次の例では、 toggleAttribute() を使って <input> の disabled 属性をトグル切り替えしています。

HTML

<input value="text" /> <button>toggleAttribute("disabled")</button>

JavaScript

const button = document.querySelector("button");
const input = document.querySelector("input");
button.addEventListener("click", () => {
  input.toggleAttribute("disabled");
});

結果

仕様書

ブラウザーの互換性