🐨CoalaCoding
DocsExamplesTry itBoardB반
🐨CoalaCoding

개발자를 위한 한국어 웹 기술 문서

문서

  • JavaScript
  • Web Publishing
  • React
  • Python

커뮤니티

  • 게시판
  • 예제 모음
  • Try it 에디터

기타

  • GitHub
  • 관리자
© 2026 CoalaCoding. All rights reserved.
  • 01_start
  • 02_class
  • 03_ai이미지-생성기-구현
  • 04_자료형
  • 05_async--await
  • 06_변수와자료형
  • 07_xmlhttprequest-부터axios-까지
  • 08_1-자바스크립트와-ecma
  • 09_reduce
  • 10_캘린더-만들기
  • 11_generator
  • 12_destructuring
  • 13_spread-operator
  • 14_module-export-import
  • 15_http-통신-이란
  • 16_시작
  • 17_2-자바스크립트-코드-실행-과정-및-용어정리
  • 18_map
  • 19_동기와-비동기
  • 20_연산자
  • 21_promise-thencatch
  • 22_3-실행컨텍스트와-스코프
  • 23_콜백-함수
  • 24_제어문
  • 25_4-클로저
  • 26_windowlocation
  • 27_함수
  • 28_5-객체
  • 29_이벤트
  1. 홈
  2. 문서
  3. JavaScript
  4. JavaScript 기초
  5. 26_windowlocation

26_windowlocation

코드 블록의 Try it Yourself 버튼으로 직접 실행할 수 있다.

구문

URL 정보 확인을 위한 window.location 속성 사용

window.location 속성을 사용하여 현재 페이지의 URL 정보를 확인할 수 있다. window.location은 Location 객체를 반환하며, 이 객체의 여러 속성을 통해 URL의 다양한 정보를 확인할 수 있다.

예시 URL: https://coalacoding.com/documentation?category=1

window.location.href // "https://coalacoding.com/documentation?category=1"
window.location.protocol // "https:"
window.location.host // "coalacoding.com"
window.location.hostname // "coalacoding.com"
window.location.port // ""
window.location.pathname // "/documentation"
window.location.search // "?category=1"

다음은 주요 속성별 설명이다:

  1. window.location.href 전체 URL 문자열을 반환한다.
  2. window.location.protocol 마지막 ':'을 포함한 프로토콜 정보를 반환한다.
  3. window.location.host URL의 호스트 정보를 반환한다. 예시 URL에는 포트 번호가 없으나, URL에 포트 번호가 있을 경우 ':'과 함께 포트 번호를 포함한다.
  4. window.location.hostname URL의 호스트명만 반환한다. 이 값은 ':'과 포트 번호를 포함하지 않는다. 예시 URL에서는 window.location.host와 window.location.hostname이 동일하나, 만약 URL이 https://coalacoding.com:8080/documentation?category=1이라면
  • window.location.host는 "coalacoding.com:8080"
  • window.location.hostname은 "coalacoding.com"이 된다.
  1. window.location.port URL의 포트 번호를 반환한다.
  2. window.location.pathname 호스트명 뒤에 오는 경로(/ 뒤의 경로)를 반환한다.
  3. window.location.search '?' 뒤에 오는 쿼리스트링을 반환한다.

목차

  • 구문