[JavaScript] Web APIs - Location

이번 부분은 좀 짧은데 그래도 새롭게 알게 된 게 있어서 강렬하게 기억에 남는다. 나무위키나 그런 곳 보면 항목 별로 링크가 걸려있는데, 그걸 누르면 해당하는 창으로 이동한다. 그런데 그게 url도 변경되는 거인 줄은 몰랐다. 뒤로가기 하면 누르기 전 장소로 바뀐다는 것도 알았지만 주소값이 변경되는 줄은 몰랐는데 그게 # (해쉬) 였던 거다. #이 이런 기능을 할 줄이야... 앞으로 더 유심히 보게될 거 같다.

 

Location

 

현재 페이지 정보를 변환하거나 제어한다.

// Location

// 현재 페이지 정보를 변환하거나 제어

// .href: 전체 URL 주소
// .protocol: 프로토콜
// .hostname: 도메인 이름
// .pathname: 도메인 이후 경로
// .host: 포트 번호를 포함한 도메인 이름
// .port: 포트 번호
// .hash: 헤시 정보(페이지의 ID)
// #: 새로고침하지 않고도 페이지의 일부로 들어갈 수 있게 함
// ex) 나무위키, mdn 문서에서 하이퍼링크 된 항목을 누르면 # 등장
// https://namu.wiki/w/NewJeans#s-3.2

// .assign(주소): 해당 주소로 페이지 이동
// .replace(주소): 해당 주소로 페이지 이동, 현재 페이지 히스토리 제거
// .reload(강력): 페이지 새로고침, 'true' 인수는 '강력' 새로고침

console.log(location);

location.assign('/xyz'); // 현재 페이지에서 xyz라는 페이지로 이동