La propiedad Element.attributes retorna una colección "viva" cuyos nodos son todos los atributos registrados en el nodo especificado. Es un NamedNodeMap, no un Array, así que no tiene los métodos de Array y los índices de nodo Attr pueden diferir en cada navegador. Más concretamente attributes es un conjunto de pares de cadenas nombre/valor que representan la información relativa a cada atributo.
Sintaxis
var attr = element.attributes;
Ejemplo
Ejemplos básicos
// Obtiene el primer elemento <p> en el documento
var para = document.getElementsByTagName("p")[0];
var atts = para.attributes;
Enumerando atributos de elemtentos
La indexación numérica es útil para recorrer de todos los atributos de un elemento.
El siguiente ejemplo corre a través de los atributors del elemento con id "p1" en el documento, e imprime el valor de cada atributo.
<!DOCTYPE html>
<html>
<head>
<title>Attributes example</title>
<script type="text/javascript">
function listAttributes() {
var paragraph = document.getElementById("paragraph");
var result = document.getElementById("result");
// Primero, verifiquenmos que el párrafo tiene algún atributo
if (paragraph.hasAttributes()) {
var attrs = paragraph.attributes;
var output = "";
for(var i = attrs.length - 1; i >= 0; i--) {
output += attrs[i].name + "->" + attrs[i].value;
}
result.value = output;
} else {
result.value = "No hay atributos que mostrar";
}
}
</script>
</head>
<body>
<p id="paragraph" style="color: green;">Párrafo de ejemplo</p>
<form action="">
<p>
<input type="button" value="Muestra el nombre cada atributo y su valor"
onclick="listAttributes();">
<input id="result" type="text" value="">
</p>
</form>
</body>
</html>
Especificaciones
| Especificación | Estado | Observaciones |
|---|---|---|
| DOM La definición de 'Element.attributes' en esta especificación. |
Living Standard | From Document Object Model (DOM) Level 3 Core Specification, moved from Node a Element |
| Document Object Model (DOM) Level 3 Core Specification La definición de 'Element.attributes' en esta especificación. |
Obsolete | Sin cambios desde Document Object Model (DOM) Level 2 Core Specification |
| Document Object Model (DOM) Level 2 Core Specification La definición de 'Element.attributes' en esta especificación. |
Obsolete | Sin cambios desde Document Object Model (DOM) Level 1 Specification |
| Document Object Model (DOM) Level 1 Specification La definición de 'Element.attributes' en esta especificación. |
Obsolete | Definición inicial. |
Compatibilidad con navegadores
| Prestación | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari |
|---|---|---|---|---|---|
| Soporte básico | (Yes) | (Yes) [1] | 6.0 [2] | (Yes) | (Yes) |
| Prestación | Android | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|
| Soporte básico | (Yes) | (Yes) [1] | (Yes) | (Yes) | (Yes) |
[1] Anes de Firefox 22, este atributo era implementado en la interfaz Node (heredada de Element). Se trasladó a esta interfaz de acuerdo a la especificación y el uso en otros navegadores.
[2] Internet Explorer 5.5 retorna un mapa conteniendo los valores en lugar de objetos attribute.
Ver también
NamedNodeMap, la interfaz del objeto retornado.- Consideracións sobre compatibilidad cruzada entre navegadores: en quirksmode