How to change css if a specific string is in the URL?-CodePudding

For an example, if I were to have a URL https://example.com/search.php?q=foobar&type=0&p=0, and I wanted to target specifically URLs with "type=0" in it, how would I do that?

I know you can use @document url() for URLs who's full name is known, but not with the link above.

EDIT: I'm not looking for the href value, I'm looking for something that will get the current pages URL, and check if it has a particular string in it. For example, if I were at the URL https://example.com/search.php?q=foobar&type=0&p=0, it would change whatever element I tell it to, but if it's https://example.com/search.php?q=foobar&type=1&p=0, it doesn't.

I probably should have made that a bit clearer.

CodePudding user response：

You can use the an attribute selector for this:

[href*="type=0"] {
  color: green;
}

<a href="https://example.com/search.php?q=foobar&type=0&p=0">Link with type=0</a>
<a href="https://example.com/search.php?q=foobar&p=0">Link without</a>

CodePudding user response：

Read the url parameters and find the one you are looking for

const urlParams = new URLSearchParams(window.location.search);
const pageType = urlParams.get('type');
console.log(pageType);