jQuery - Find href that contains a value and return the full value

Question

I\'d like to search the body for an href that contains /test/. I then want to return the entire href value e.g. /test/123/.

Below is what I

Answer 1

You can do it like following using jQuery contain attribute selector.

$('a[href*="/test/"]').attr('href');

Answer 2

Open your console and run this. It will log out all of the links with "/test/" in. You said that you were looking for links that contain "/test/". The other answers I have seen only match for links starting with "/test/".

Bear in mind that this will pull out all of the matching links, not just one so you will be returned an array.

const $links = $("a").filter((index, anchor) => $(anchor).attr('href').match(/\/test\//));
const hrefs = $.map($links, link => $(link).attr('href'));
console.log(hrefs);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a href="/test/123">link 1</a>
<a href="/test/456">link 2</a>
<a href="/123">link 3</a>
<a href="/456">link 4</a>
<a href="/test/789">link 5</a>

Answer 3

use starts with selector

$( "a[href='^/test/'" ).attr( "href" )

Answer 4

You're using jQuery so use the "attribute contains selector" (https://api.jquery.com/attribute-contains-selector/) and retrieve the href values using "attr" (http://api.jquery.com/attr/).

The following line of code will return all a elements with an href containing the text "/test/".

var matchingElements = $("a[href*='/test/']")

...and the following code will return an array of their href attributes.

var hrefs = matchingElements.map(function(index, element) {
    return $(element).attr('href');
});

Answer 5

You can use CSS “Substring Matching Attribute Selectors” to search the word in a string .

  $("body a[href='^/test/'").attr("href")

[att] Represents an element with the att attribute, whatever the value of the attribute.

[att=val] Represents an element with the att attribute whose value is exactly "val".

[att~=val] Represents an element with the att attribute whose value is a whitespace-separated list of words, one of which is exactly "val". If "val" contains whitespace, it will never represent anything (since the words are separated by spaces). Also if "val" is the empty string, it will never represent anything.

[att|=val] Represents an element with the att attribute, its value either being exactly "val" or beginning with "val" immediately followed by "-" (U+002D). This is primarily intended to allow language subcode matches (e.g., the hreflang attribute on the a element in HTML) as described in BCP 47 ([BCP47]) or its successor. For lang (or xml:lang) language subcode matching, please see the :lang pseudo-class.

Reference : Reference link