Element.classList

Sintaxis

var elementClasses = elementNodeReference.classList;

elementClasses es un DOMTokenList que representa el atributo clase de elementNodeReference. Si el atributo clase no est definido o est vaco, elementClasses.length devuelve 0. element.classList por s mismo es de slo lectura, aunque puede ser modificado usando los mtodos add() y remove().

Mtodos

add( String [, String] )

Aade las clases indicadas. Si estas clases existieran en el atributo del elemento sern ignoradas.

remove( String [, String] )

Elimina las clases indicadas. Nota: Eliminar una clase que no existe NO produce un error.

item( Number )

Devuelve el valor de la clase por ndice en la coleccin.

toggle( String [, force] )

Cuando slo hay un argumento presente: Alterna el valor de la clase; ej., si la clase existe la elimina y devuelve false, si no, la aade y devuelve true. Cuando el segundo argumento est presente: Si el segundo argumento se evala como true, se aade la clase indicada, y si se evala como false, la elimina.

contains( String )

Comprueba si la clase indicada existe en el atributo de clase del elemento.

replace( oldClass, newClass )

Reemplaza una clase existente por una nueva.

Ejemplos

// div es una referencia de objeto al elemento <div> con class="foo bar"
div.classList.remove("foo");
div.classList.add("anotherclass");

// si visible est presente la elimina, de lo contrario la aade
div.classList.toggle("visible");

// aadir/eliminar visible, dependiendo de la condicin, i menor que 10
div.classList.toggle("visible", i < 10);

alert(div.classList.contains("foo"));

// aadir o eliminar varias clases
div.classList.add("foo", "bar");
div.classList.remove("foo", "bar");

// reemplazar la clase "foo" por "bar"
div.classList.replace("foo", "bar");

Especificaciones

Compatibilidad con navegadores

Vase tambin

• element.className
• DOMTokenList;