What does "a[href*=#]:not([href=#])" code mean?

Question

I don't understand clearly what does this code mean ?

a[href*=#]:not([href=#])

Thank you !

Answer 1

This post is ancient, but incase anyone is still looking. Does this only grab:

<a href="#step1">yes</a>
<a href="page.php#step2">yes</a>

or will it also grab:

<a href="/path/to/page.php#step2">yes</a>

In testing, it looks like the first group only, and I need it to grab the first and the second.

Answer 2

Simply:

a[href*=#] 

gets all anchors (a) that contain # in href.

But with:

:not([href=#])

excludes anchors with href exactly equal to #.

Example:

<a href="#step1">yes</a>
<a href="page.php#step2">yes</a>
<a href="#">no</a> 

the selector gets the first two anchors, but it excludes the last.

For more details you can consult the attribute selectors chapter

Answer 3

Just in case anyone had the same problem as me with it and new version of jQuery : The solution is not to use a[href*=#]:not([href=#]) but

use

a[href*="#"]:not([href="#"])

This was a breaking change in jQuery 2.2.4 onwards.

Answer 4

means that all elements with href attribute conatining '#', except those whose href attribute equals to #

Answer 5

That's a CSS3 selector that gets all the a whose href attribute contains a #, but are not just made up of the single # char.

e.g.

Matched

<a href="#home">Home</a>
<a href="index.html#contact">Contact</a>

Not Matched

<a href="#">Top</a>

Answer 6

It is a CSS selector that matches any a element that has a href attribute containing the # character, but not anchor tags which have only #.

So for example, it'll match: <a href="#test">Test Anchor</a>, but not <a href="#">Blank</a>