Como mostré en posts anteriores jQuery permite cambiar clases CSS de los elementos e incluso cambiar de manera individual propiedades CSS. En este post mostraré como manejar atributos HTML con las funciones attr() y removeAttr().
Función attr()
Esta fución permite leer un atributo HTML especificado de un elemento. Por ejemplo, podríamos sacar la URL de un elemento <a > pasando href como parámetro.
|
1 |
var url = $('#enlace a').attr('href'); |
La variable url tendrá el enlace que apunte el vínculo con id «enlace».
La función attr() devuelve el valor del atributo como está fijado en el HTML. Si el enlace tiene una ruta relativa como valor, ‘./pagina.html’ devolverá esa ruta tal cual.
Una cosa a tener en cuenta es que es case-insenstive por tanto, si metes el parámetro como Href o HREF lo admitirá igual.
En caso de pasarle un segundo argumento a la función attr() estarías asignando un valor al atributo de un elemento. Por ejemplo, si nos basamos en el ejemplo anterior podríamos cambiar la dirección del enlace.
|
1 |
var url = $('#enlace a').attr('href', 'https://www.google.es/'); |
Eliminar un atributo
Para quitar completamente un atributo de un elemento usa la función removeAttr(). Por ejemplo, este código eliminaría el atributo class de todos los div o cajas de la página.
|
1 |
$('div').removeAttr('class'); |
El atributo desparecería completamente incluyendo todos los valores que tenga.
Y hasta aquí manejar atributos HTML con jQuery, espero que podáis sacarle partido. A seguir picando 🙂