Ejemplo de Dom Element.setAttribute

Establece el valor de un attribute en el elemento especificado. Si el attribute ya existe, el valor se actualiza; de lo contrario un nuevo attribute se agrega con el nombre y valor especificados.

Para obtener el valor actual de un attribute, usar getAttribute(); para eliminar un attribute, llama removeAttribute().

Sintaxis

Element.setAttribute(name, value);

Parámetros

name

A DOMString especificando el nombre del attribute cuyo valor se va a establecer. los attribute el nombre se convierte automáticamente a minúsculas cuando setAttribute() se llama en un elemento HTML en un documento HTML.

value

A DOMString que contiene el valor para asignar a la attribute. Cualquier nostring El valor especificado se convierte automáticamente en un string.

Booleano attributes se consideran true si están presentes en el elemento, independientemente de su value; como regla, debe especificar el vacío string ("") en value (algunas personas usan el attribute’nombre de; esto funciona pero no es estándar). Consulte el ejemplo siguiente para ver una demostración práctica.

Dado que el especificado value se convierte en un string, especificando null no necesariamente hace lo que esperas. En lugar de quitar el attribute o estableciendo su valor en null, en su lugar establece el attributevalor para el string "null". Si desea eliminar un attribute, llama removeAttribute().

Valor devuelto

undefined.

Excepciones

InvalidCharacterError

El especificado attribute name contiene uno o más caracteres que no son válidos en attribute nombres.

Ejemplo

En el siguiente ejemplo, setAttribute() se usa para configurar attributes en un .

HTML

<button>Hello Worldbutton>

JavaScript

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

b.setAttribute("name","helloButton");
b.setAttribute("disabled","");

Esto demuestra dos cosas:

• La primera llamada a setAttribute() arriba muestra el cambio de name attributeEl valor de “helloButton”. Puede ver esto usando el inspector de páginas de su navegador (Cromo, Borde, Firefox, Safari).
• Para establecer el valor de un booleano attribute, tal como disabled, puede especificar cualquier valor. Un vacío string o el nombre del attribute son valores recomendados. Todo lo que importa es que si el attribute está presente en absoluto, independientemente de su valor real, su valor se considera true. La ausencia del attribute significa que su valor es false. Al establecer el valor de la disabled attribute al vacio string (""), estamos estableciendo disabled para true, lo que da como resultado que el botón se deshabilite.

Métodos DOM que tratan con elementos attributes:

No son los métodos que se utilizan con mayor frecuencia y que tienen en cuenta el espacio de nombres	Variantes que reconocen el espacio de nombres (DOM Nivel 2)	Métodos DOM Nivel 1 para tratar Attr nodos directamente (rara vez se usa)	Métodos conscientes del espacio de nombres DOM Nivel 2 para tratar Attr nodos directamente (rara vez se usa)
setAttribute (DOM 1)	setAttributeNS	setAttributeNode	setAttributeNodeNS
getAttribute (DOM 1)	getAttributeNS	getAttributeNode	getAttributeNodeNS
hasAttribute (DOM 2)	hasAttributeNS	–	–
removeAttribute (DOM 1)	removeAttributeNS	removeAttributeNode	–

Especificaciones

Especificación	Estado	Comentario
DOM La definición de ‘setAttribute ()’ en esa especificación.	Estándar de vida

Compatibilidad del navegador

	Escritorio						Móvil
	Cromo	Borde	Firefox	explorador de Internet	Ópera	Safari	WebView Android	Chrome Android	Firefox para Android	Opera Android	Safari en IOS	Internet de Samsung
setAttribute	1	12	1	5 En Internet Explorer 7 y versiones anteriores, setAttribute no establece estilos y elimina eventos cuando intenta configurarlos.	8	1	1	18	4	10.1	1	1.0

Notas de gecko

Utilizando setAttribute() para modificar ciertos attributes, más destacado value en XUL, funciona de manera inconsistente, ya que el attribute especifica el valor predeterminado. Para acceder o modificar los valores actuales, debe utilizar las propiedades. Por ejemplo, use Element.value en lugar de Element.setAttribute().