Javascript Location 오브젝트 모음

JavaScript

현재 접속해있는 사이트의 location 정보를 가져올 수 있는 location object에 대해 잊지 않기 위해 간단히 기록해본다.

브라우저 개발자도구로 바로 테스트해볼 수 있으니 직접 써보면 이해하는데 더 도움이 될 것 같다.

location.hash

현재 보고있는 페이지의 # 이후의 정보(해시)를 가져온다.

https://wallel.com/test.html#part2
=> #part2

location.host

현재 보고있는 페이지의 호스트를 가져온다.
도메인에 포트번호가 있다면 함께 가져온다.

https://wallel.com/
=> wallel.com
https://wallel.com:1234
=> wallel.com:1234

location.hostname

현재 보고있는 페이지의 호스트네임을 가져온다.
host와 다른점은 포트번호가 있어도 가져오지 않는다.

https://wallel.com/
=> wallel.com
https://wallel.com:1234
=> wallel.com

location.href

현재 보고있는 페이지의 전체 주소를 가져온다.

https://wallel.com/test.html
=> https://wallel.com/test.html
https://wallel.com:1234/test.html&key=value
=> https://wallel.com:1234/test.html&key=value

location.origin

현재 보고있는 페이지의 프로토콜, 호스트네임, 포트번호를 가져온다.

https://wallel.com/test.html#hash=2
=> https://wallel.com
https://wallel.com:1234/test.html#hash=2
=> https://wallel.com:1234

location.pathname

현재 보고있는 페이지의 경로를 가져온다.

https://wallel.com/dir/test/test.html#part=2
=> /dir/test/
https://wallel.com/
=> /

location.port

현재 보고있는 페이지의 포트번호를 가져온다.

https://wallel.com:1234/
=> 1234

location.protocol

현재 보고있는 페이지의 프로토콜을 가져온다.

https://wallel.com/
=> https:
http://wallel.com/
=> http:

location.search

현재 보고있는 페이지의 Query String을 가져온다.

http://wallel.com/?mod=list&key=value
=> ?mod=list&key=value

참고문서

  1. https://www.w3schools.com/jsref/obj_location.asp
  2. https://blog.lael.be/post/400

2023.06.01 추가

URL 이라는 Class도 있으니 참고해보면 좋을듯. (참고 글)

블로그
프로젝트
스터디