Método setAttributeNode() del elemento HTML DOM

Definición y uso

setAttributeNode() El método agrega el nodo de atributo especificado al elemento y devuelve el objeto Attribute.

Si este atributo especificado ya existe, este método lo reemplazará.

Solución alternativa:

Usar Método setAttribute() Más fácil.

Vea también:

Manual de referencia:

Método getAttributeNode()

Método removeAttributeNode()

Método createAttribute()

Método getAttribute()

Método setAttribute()

Método hasAttribute()

Atributo de valor de Attribute

Objeto Attribute del HTML DOM

Tutoriales:

Atributos de HTML

Diferencias entre setAttribute() y setAttributeNode()

setAttribute() Método para reemplazar el valor del atributo.

setAttributeNode() Método para reemplazar el objeto Attribute.

Antes de agregar el atributo al elemento, debe crear el objeto Attr y establecer el valor de Attr.

El resultado será el mismo.

Ejemplo

Ejemplo 1

Establecer el nodo de atributo de la clase del primer elemento <h1>:

const attr = document.createAttribute("class");
attr.value = "democlass";
const h1 = document.getElementsByTagName("H1")[0];
h1.setAttributeNode(attr);

Prueba personalmente

Antes de la configuración:

Hello World

Después de la configuración:

Hello World

Ejemplo 2

Establecer el nodo de atributo de la propiedad href del elemento <a>:

const attr = document.createAttribute("href");
attr.value = "";
const anchor = document.getElementById("myAnchor");
anchor.setAttributeNode(attr);

Prueba personalmente

Antes de la configuración:

Visite codew3c.com

Después de la configuración:

Visite codew3c.com

Sintaxis

element.setAttributeNode(newAttr)

Parámetro

Parámetro Descripción
newAttr Requerido. Representa el nodo Attr que se desea agregar o el atributo cuyo valor se necesita modificar.

Valor de retorno

Tipo Descripción
Objeto

Representa el objeto Attr del nodo de atributo reemplazado.

Si no se reemplaza ningún atributo, será null.

Lanzar

Este método lanzará una excepción DOMException que contiene el siguiente código:

Excepción Descripción
INUSE_ATTRIBUTE_ERR newAttr Ya es miembro de la colección de atributos de otro nodo Elemento.
NO_MODIFICATION_ALLOWED_ERR El nodo Elemento actual es de solo lectura y no se permite modificar sus atributos.
WRONG_DOCUMENT_ERR newAttr La propiedad ownerDocument es diferente al nodo Elemento al que se desea establecer.

Compatibilidad con navegadores

element.setAttributeNode() Es una característica de DOM Level 1 (1998).

Todos los navegadores lo soportan completamente:

Chrome IE Edge Firefox Safari Opera
Chrome IE Edge Firefox Safari Opera
Soporte 9-11 Soporte Soporte Soporte Soporte