Seleccione <a> que href termina con alguna cadena

669

¿Es posible usar jQuery para seleccionar todos los <a>enlaces que href termina con "ABC"?

Por ejemplo, si quiero encontrar este enlace <a href="http://server/page.aspx?id=ABC">

Aximili
fuente

Respuestas:

1550
   $('a[href$="ABC"]')...

La documentación del selector se puede encontrar en http://docs.jquery.com/Selectors

Para atributos:

= is exactly equal
!= is not equal
^= is starts with
$= is ends with
*= is contains
~= is contains word
|= is starts with prefix (i.e., |= "prefix" matches "prefix-...")
tvanfosson
fuente
20
Algo cambió recientemente. $ ('[href $ = - abc]') solía funcionar. Ahora requiere comillas $ ('[href $ = "- abc"]') No sé cuándo cambió. Tal vez siempre se suponía que necesitaba cotizaciones y simplemente funcionaba antes.
gman
12
Tenga en cuenta que "ABC" distingue entre mayúsculas y minúsculas. (Acabo de pasar bastante tiempo para resolverlo ...)
Louis Somers
Cómo obtener href no contiene ABC en jquery
sf.dev
1
@ sf.dev$('a').filter(function() { return !this.href || !this.href.match(/ABC/); });
tvanfosson
99
Esto funciona con vainilla javascirpt ahora. Simplemente puede usar document.querySelectorAll('a[href$="ABC"]')para lograr esto.
k-nut
21
$('a[href$="ABC"]:first').attr('title');

Esto devolverá el título del primer enlace que tiene una URL que termina con "ABC".

Ceniza
fuente
44
Corrección: que termina con ABC
sparkyspider
En realidad, hay una ligera diferencia. Esto seleccionará el primer enlace con href dado, que es útil si necesita cambiar solo uno.
alekwisnia
15
$("a[href*='id=ABC']").addClass('active_jquery_menu');
Sumit
fuente
2
Para futuros visitantes que puedan recibir ayuda de esa respuesta.
sscirrus
@Sumit tenga en cuenta que su respuesta solo es correcta si los OP se ABCrefieren a una ID.
sscirrus
6
$("a[href*=ABC]").addClass('selected');
Ganesh Anugu
fuente
2

En caso de que no desee importar una gran biblioteca como jQuery para lograr algo tan trivial, puede utilizar el método incorporado querySelectorAll. Casi todas las cadenas de selector utilizadas para jQuery también funcionan con métodos DOM:

const anchors = document.querySelectorAll('a[href$="ABC"]');

O, si sabe que solo hay un elemento coincidente:

const anchor = document.querySelector('a[href$="ABC"]');

En general, puede omitir las comillas alrededor del valor del atributo si el valor que está buscando es alfanumérico, por ejemplo, aquí, también podría usar

a[href$=ABC]

pero las cotizaciones son más flexibles y generalmente más confiables .

Cierto rendimiento
fuente