href="#, #none, javascript:void(0)" 차이점

태그는 로 사용해야 하고, 어느 홈페이지 URL도, id값 작성도 해야하지 않는 경우엔 어떻게 할까요?

그냥 href="" 로 비워두면 될까요?

❌ NO ❌

비워둘 경우엔 유효성 오류가 나기에 좋은 코드가 아닙니다.

그래서 비워두지 않고 아래와 같은 값을 넣어줍니다.

<a href="#"></a> <a href="#none"></a> <a href="javascript:;"></a> <a href="javascript:void(0);"></a>

이 중에 아무거나 쓰면 될까요?

❌ NO ❌

차이점이 있습니다.

a href="#"
#만 쓸 경우에는 이 태그를 누르면 스크롤이 어디에 있든 최상단으로 이동합니다. 디자이너나 개발자에게 보여주는 퍼블리싱용일지 언정 이렇게 사용하면 잘못 눌렀을 때 불편하겠죠?

a href="#none"
샵 뒤에 아이디로 쓰지 않는 텍스트를 넣습니다. 그러면 어느 오브젝트로도 이동하지 않고, 스크롤 이동도 없습니다.

a href="javascript:;"
자바스크립트라고 작성하였지만 아무런 일도 생기지 않습니다. 스크롤 이동도, undefined 발생도 없습니다.

a href="javascript:void(0);"
void 안에 0말고 영문, 숫자도 사용가능합니다. 이 또한 a태그의 이동기능을 무력화시킵니다.
그러나 void 는 undefined를 리턴하는 연산자입니다. javascirpt:는 브라우저에게 뒤에 작성된 함수를 실행시키는 의미를 담고 있습니다. 그러다면 브라우저에게 void(0) 연산자를 실행하라고 말하는 의미겠죠?
그러면 a태그의 기본 기능은 작동되지 않겠지만 undefined를 리턴하기에 좋은 방법은 아니겠습니다.