JavaScript 강좌 | Object > location

URL에 따라 다른 정보를 출력하거나 다른 디자인을 하는 등의 작업을 할 때가 있습니다. 이런 작업을 할 때 현재 URL 정보를 가져와야 하는데, 이를 가능케하는 객체가 location입니다.

URL 전체 또는 일부의 정보를 가져올 수 있는데, 대표적인 몇가지는 다음과 같습니다.

  • location
  • location.host
  • location.hostname
  • location.href
  • location.pathname
  • location.protocol

예제

URL이

https://example.cmsfactory.net/_lab/javascript.html

일 때, 각 객체 속성이 어떤 값을 가져오는지 알아보는 예제입니다.

<!doctype html>
<html lang="ko">
  <head>
    <meta charset="utf-8">
    <title>JavaScript</title>
    <style>
      h1 {
        font-family: "Times New Roman";
        font-style: italic;
      }
    </style>
  </head>
  <body>
    <h1>location</h1>
    <script>
      document.write( location );
    </script>
    <h1>location.host</h1>
    <script>
      document.write( location.host );
    </script>
    <h1>location.hostname</h1>
    <script>
      document.write( location.hostname );
    </script>
    <h1>location.href</h1>
    <script>
      document.write( location.href );
    </script>
    <h1>location.pathname</h1>
    <script>
      document.write( location.pathname );
    </script>
    <h1>location.protocol</h1>
    <script>
      document.write( location.protocol );
    </script>
  </body>
</html>

Created on 2014-02-09 17:52 | Updated on 2017-12-08 01:19