jQuery
Atributos
Buscar..
Observaciones
La función jQuery .attr()
obtiene el valor de un atributo para el primer elemento en el conjunto de elementos coincidentes o establece uno o más atributos para cada elemento coincidente.
Vale la pena señalar que al obtener el valor de un atributo, solo lo obtiene del primer elemento que coincide con el selector (es decir, $("input").attr("type");
solo obtendría el tipo de la primera entrada , si hay más de uno)
Sin embargo, al configurar un atributo, se aplicará a todos los elementos coincidentes.
Obtener el valor de atributo de un elemento HTML
Cuando se pasa un solo parámetro a la función .attr()
, devuelve el valor del atributo pasado en el elemento seleccionado.
Sintaxis:
$([selector]).attr([attribute name]);
Ejemplo:
HTML:
<a href="/home">Home</a>
jQuery:
$('a').attr('href');
Obteniendo atributos de data
:
jQuery ofrece la función .data()
para manejar los atributos de datos. .data
función .data
devuelve el valor del atributo de datos en el elemento seleccionado.
Sintaxis:
$([selector]).data([attribute name]);
Ejemplo:
HTML:
<article data-column="3"></article>
jQuery:
$("article").data("column")
Nota:
El método data () de jQuery le dará acceso a los atributos data- *, PERO, obstruye el caso del nombre del atributo. Referencia
Valor de ajuste del atributo HTML
Si desea agregar un atributo a algún elemento, puede usar la función attr(attributeName, attributeValue)
. Por ejemplo:
$('a').attr('title', 'Click me');
Este ejemplo agregará el texto "Click me"
mouse "Click me"
en todos los enlaces de la página.
La misma función se utiliza para cambiar los valores de los atributos.
Quitando atributo
Para eliminar un atributo de un elemento, puede usar la función .removeAttr(attributeName)
. Por ejemplo:
$('#home').removeAttr('title');
Esto eliminará el atributo de title
del elemento con ID de home
.
Diferencia entre attr () y prop ()
attr()
obtiene / establece el atributo HTML usando las funciones DOM getAttribute()
y setAttribute()
. prop()
funciona estableciendo la propiedad DOM sin cambiar el atributo. En muchos casos, los dos son intercambiables, pero ocasionalmente se necesita uno sobre el otro.
Para establecer una casilla de verificación como está marcado:
$('#tosAccept').prop('checked', true); // using attr() won't work properly here
Para eliminar una propiedad puede usar el método removeProp()
. De forma similar, removeAttr()
elimina los atributos.