Modificar aspecto de un enlace HTML filtrando por su HREF con jQuery

Modificar aspecto de un enlace HTML filtrando por su HREF con jQuery

En ocasiones podemos querer cambiar el aspecto de un enlace u ocultarlo a la vista según su destino (HREF) Con jQuery podemos hacerlo:


Supongamos que tenemos el siguiente HTML
<ul class="itemTags">
  <li><a href="/...enlace1/tag/DESTACADO">enlace 1 destacado/</a></li>
  <li><a href="/...enlace2/tag/DESTACADO/">enlace 2 destacado</a></li>
<li><a href="/...enlace3/tag/OCULTO/">enlace 3 oculto</a></li>
  <li><a href="#">enlace 4</a></li>
  <li><a href="#">enlace 5</a></li>
</ul>
Con el siguiente script de jQuery podemos ocultar los enlaces que contienen en su HREF "/OCULTO" y podemos destacar los que continen "tag/DESTACADO"
<script>
$(document).ready(function() {
$( 'ul.itemTags li a[href*="/tag/OCULTO"]' ).each(function() {$( this).parent().css( "display","none" ); }); // modifica el elemento "li"
$( 'ul.itemTags li a[href*="/tag/DESTACADO"]' ).each(function() {$(this).css( { "background-color":"green","color":"white" } ); }); // Modifica el elemento "a"
});
</script>

Comentarios (0)

Puntuación 0 de 5 basado en 0 votos
No hay comentarios escritos aquí

Deja tus comentarios

  1. Publicar comentario como invitado. Regístrate o ingresaa tu cuenta
Rate this post:
0 Caracteres
Archivos adjuntos (0 / 3)
Compartir su ubicación
Bonaval Multimedia
Bonaval Multimedia S.L.

Elduayen 16 Entresuelo B, Vigo 36202 (Pontevedra, Galicia, España)
Diseño y desarrollo:  Bonaval Multimedia SL   Copyright ©