<a href="#">
javascript:void(0);
javascript:;
기초가 되는 태그 중에 하나 지만 차이점이 맨날 헛갈림..
왜 저렇게 쓰는지도 모르고 그냥 사용함..
1. 기본적인 사용법 : a 태그에 onclick 사용하기
a 태그를 클릭하면 href 에 지정한 url 로 페이지가 바뀌면서 이동하게 되는데
그렇게 이동하고 싶지 않을때 사용함
쉽게 말해 a태그의 디자인성은 살리면서 링크 없애기
2. 차이점
<a href ="#">링크 </a> 의 문제점은 페이지가 긴 스크롤이 있는 곳에서 사용하면 무조건 페이지 상단으로 이동함
<a href ="#" onclick="return false">링크 </a> 와 같은 방식으로 해결 가능
추가 설명
<a href ="#"> 태그는 기본적으로 div id 로 이동할때 사용됨
<a href ="#seoul">서울</a> <a href ="#busan">부산</a> <a href ="#daegu">대구</a> <div id="seoul">서울은 어쩌구 저쩌구....</div> <div id="busan">부산은 어쩌구 저쩌구....</div> <div id="daegu">대구는 어쩌구 저쩌구....</div> |
<a href ="javascript:void(0)">링크 무효</a>
설명충
1. 여기서 void 연산자가 undefined 값 돌려줌
2. a태그가 작동하지 않는 원리
3. void( ) 에서 ( ) 안의 값이 숫자나 영문자 등등 사용해도 문제 없지만 일반적으로 0으로 사용..
왜 인지 묻지 말고 그냥 0으로 사용하는게 정신건강에 이로움
<a href ="javascript:;">링크 무효</a> 도 있음.
<a href ="javascript:void(0)"> 와 같은 기능
궁금증....
javascript:void(0), javascript:; 사용시 문제점은 없는가..?
- 구버전의 IE, firefox, chrome 등에서 정상적인 페이지가 보이지 않을수도 있음
→ 이거 문제 될 정도면 사용자 보고 브라우저 업데이트 하라고 하자..
- 브라우저에서 사용자가 개인적으로 자바스크립트 무효화 옵션을 사용하면 안될수 있음
→ 개발자나 관련된 종사자가 아닌이상 일반인이 이런 옵션 사용할 가능성 거의 없음