Eslint-plugin-jsx-a11y: anchor-is-valid - why <a href="#" /> is Invalid ?

[zcs19871221]

question with rules : anchor-is-valid

why <a href="#" /> is Invalid ?
it just make navigation . and i just use it to jump to the top of page. please teach me, thanks

[ljharb]

You can use #top for that.

[SalTor]

First, the href needs a specific target. AKA, which element with a blank ID are you targeting? Probably none, so place an element with, say, id="top" at the beginning of your page.

Second, anchor tags need contents, as described by the jsx-a11y/anchor-has-content linting rule

[ljharb]

You don’t need an element; all browsers send #top to the same place as #.

[SalTor]

Thanks @ljharb ! Good to know

[ljharb]

To answer the original question; it's because # is almost exclusively abused to make a link that doesn't actually go anywhere, so they can add JS behavior. #top, at least, is explicit.