JS) Location.hash 와 URL의 #부분 처리

URL에서 #부분은 몇몇 상황에서 활용된다.

1. 웹페이지 사용자에게 필요한 위치로 이동 (id를 이용)
2. Callback

만약, 아래와 같이 만들면 ID가 menuul인 위치로 이동하게 된다.

https://hi098123.tistory.com/#menuul

location.hash를 이용하면 #을 포함한 뒷부분의 값을 알아낼 수 있다.

var x = location.hash;
console.log(x); // #menuul

 

Callback 에서

https://url#token=abcdef123456789&expire=3600 와 같이 Callback을 주는경우

 

다음의 이벤트 리스너를 이용할수도 있다.

addEventListener 의 hashchange

function hashHandler() {
  console.log(location.hash);
  //#token=abcdef123456789&expire=3600
}

window.addEventListener('hashchange', hashHandler, false);

 

IE 8 이상에서 hashchange 를 지원하므로

현존하는 대부분의 브라우저에서 동작한다고 보면된다.