자바스크립트 현재 URL 해시(프래그먼트) 가져오기

올바른 이해와 사용 방법

현재 페이지의 URL 해시(프래그먼트)는 window.location.hash 속성으로 가져올 수 있습니다.

window.location.hash 속성은 현재 URL의 해시(# 포함) 정보를 문자열로 반환합니다. 해시가 없으면 빈 문자열("")을 반환합니다.

참고하세요!
window.location.hash 속성은 줄여서 location.hash라고만 작성하는 경우도 많습니다.
브라우저에서는 window 객체가 전역 객체이므로, window.location는 줄여서 location만으로도 동일하게 사용할 수 있습니다.

문자열로 반환되는 URL의 해시 정보

URL에서 해시(Hash)는 URL의 마지막 뒷부분에 샵(#) 기호로 구분되어 시작하는 주소의 일부로, 페이지 내 특정 위치를 가리킵니다.

샵(#) 기호를 URL에서는 해시 기호(Hash mark)라고 부르는 것에서 유래하여 관행적으로 해시(Hash)라고 말하지만, URL의 구성 요소로서 사용되는 공식 용어는 '프래그먼트(URI Fragment)'입니다.

window.location.hash 속성은 현재 URL에서 사용되는 해시를 문자열로 반환합니다.

기본 예제

현재 웹 페이지가 어떤 해시를 가지고 있는지 콘솔에 출력하는 가장 단순한 코드입니다.

window 객체는 생략할 수 있으며, 보통 location.hash를 사용합니다.

JavaScript

/* 전체 URL 예: https://www.example.com/products/list?page=1#review */
console.log(location.hash); // console.log(window.location.hash)와 동일
// 출력: "#review"