Element.toggleAttribute()

Il metodo toggleAttribute() dell'interfaccia Element attiva/disattiva un attributo booleano (rimuovendolo se è presente e aggiungendolo se non è presente) sull'elemento specificato.

Element.toggleAttribute(name [, force]);

name

Una DOMString che specifica il nome dell'attributo da attivare. Il nome dell'attributo viene automaticamente convertito in minuscolo quando toggleAttribute() viene chiamato su un elemento HTML in un documento HTML.

force Optional

Un valore booleano per determinare se l'attributo deve essere aggiunto o rimosso, indipendentemente dal fatto che l'attributo sia presente o meno al momento.

true se l'attributo name è eventualmente presente, in caso contrario false.

InvalidCharacterError

L'attributo specificato name contiene uno o più caratteri che non sono validi nei nomi degli attributi.

Nell'esempio seguente, toggleAttribute() viene utilizzato per commutare l'attributo  readonly di un <input>.

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

var button = document.querySelector("button");
var input = document.querySelector("input");

button.addEventListener("click", function(){
  input.toggleAttribute("readonly");
});

DOM methods dealing with element's attributes:

if (!Element.prototype.toggleAttribute) {
  Element.prototype.toggleAttribute = function(name, force) {
    if(force !== void 0) force = !!force

    if (this.getAttribute(name) !== null) {
      if (force) return true;

      this.removeAttribute(name);
      return false;
    } else {
      if (force === false) return false;

      this.setAttribute(name, "");
      return true;
    }
  };
}