📝
서은 STUDY_SCRIPT
  • JAVASCRIPT 기록
  • JAVASCRIPT 문법정리
    • 데이터 저장하기
    • 데이터 불러오기
    • 데이터 실행하기
    • 데이터 제어하기
    • 면접질문 정리
  • PHP를 이용한 사이트 작업
    • PHP와 MySQL
      • 댓글쓰기
      • 회원가입
      • 로그인
      • 게시판
        • 페이지네이션 & 게시글보기
        • 수정/삭제/목록/검색
  • 생활코딩 JavaScript
    • JavaScript 입문수업
      • Basic
        • 자바스크립트 기본 세팅
        • 데이터타입
        • 변수
        • 연산자
        • 조건문
        • 반복문
        • 함수
        • 배열
        • 객체
        • 모듈
        • 정규표현식
      • 함수지향
        • 유효범위
        • 값으로서 함수
        • 값으로서 콜백
        • 클로저
        • arguments
        • 함수의 호출
      • 객체지향
        • 생성자와 new
        • 전역객체
        • this
        • 상속
        • Prototype
        • 표준내장객체의 확장
        • Object
        • 데이터 타입
        • 복제 & 참조
    • JavaScript Basic
      • 자바스크립트란?
      • 데이터타입
      • 변수와 대입연산자
      • 제어할 태그 선택
      • 비교연산자와 불리언
      • 조건문 if
      • 리팩토링
      • 배열 [ ]
      • 반복문 while
      • 배열과 반복문
        • 배열과 반복문의 활용
      • 함수
        • 함수의 활용
      • 객체 { }
        • 객체와 반복문 for~in
        • 프로퍼티와 메소드
        • 객체의 활용
      • 파일로 쪼개서 정리정돈
      • 라이브러리 & 프레임워크
      • UI & API
    • Web Browser
      • JavaScript란?
      • BOM
        • 전역객체 window
        • 사용자와 커뮤니케이션
        • Location 객체
        • Navigator 객체
        • 창 제어
      • DOM
        • 제어 대상 찾기
        • jQuery
        • HTMLElement
        • Element 객체
          • 식별자 API
          • 조회 API
          • 속성 API
        • Node 객체
          • Node 관계 API
          • Node 종류 API
          • Node 변경 API
          • jQuery 노드 변경 API
          • 문자열로 노드 제어
        • HTMLCollection
      • 이벤트
        • 이벤트 등록
        • 이벤트 전파(버블링과 캡처링)
        • 이벤트 기본 동작 취소
        • 이벤트 타입
      • 네트워크 통신
        • Ajax
        • JSON
  • NOMAD JAVASCRIPT
    • VanillaJS
      • Why JS?
      • ES5, ES6
      • Basic
        • Alert & Console
        • Variable
        • Data Types
        • Array & Object
      • Function
      • DOM
        • Event & Event handler
        • Conditional
        • Function Practice
      • Momentum App
        • Making a JS Clock
        • Saving the User Name
        • To-Do List
        • Image Background
        • Getting Weather
  • DREAM CODING
    • 자바스크립트 기초 강의 (ES5+)
      • JavaScript 역사
      • async & defer / Strict Mode
      • Variable / Hoisting / Data Type
      • Operator / if / Loop
      • Function
        • 함수의 선언
        • 함수의 표현
      • Class
      • Object
      • Array
      • Array API
      • JSON
      • Callback
      • Promise
      • Async & Await
  • WEB BOS
    • #JavaScript30
Powered by GitBook
On this page
  • Location
  • 1. 현재 윈도우의 URL 알아내기
  • 2. URL Parsing
  • 3. URL 변경하기
  • 3-1. 사용자가 다른 URL로 이동시켜야 할 때
  • 3-2. 현재 웹페이지 내용을 리로드하고 싶을 때

Was this helpful?

  1. 생활코딩 JavaScript
  2. Web Browser
  3. BOM

Location 객체

Location

문서의 주소와 관련된 객체로 Window 객체의 프로퍼티

  1. 브라우저의 창에 열려있는 문서의 URL을 알려주며 변경도 가능

  2. 문서의 위치와 관련해서 다양한 정보를 얻을 수 있음

1. 현재 윈도우의 URL 알아내기

console.log(location.toString(), location.href);

location.href 방식을 더 선호 함

2. URL Parsing

location 객체는 URL을 의미에 따라서 별도의 프로퍼티로 제공함

console.log(location.protocol, location.host, location.port, location.pathname, location.search, location.hash)

location(URL) = http://example.com:8080/test.jsp?gg=1&pp=2#q=html5

  1. location.protocol : ex) http:

  2. location.host : 컴퓨터를 식별하는 주소 ex) example.com:8080

  3. location.port : 그 컴퓨터에서 돌아가는 여러가 소프트웨어들을 식별하는 번호 ex) 8080

  4. location.pathname : 웹 서버에 접속했을 때 구체적인 정보를 요청하는 정보 ex) test.jsp

  5. location.search : 애플리케이션에 전달한 값을 알고싶을 때 ex) ?gg=1&pp=2

  6. location.hash : 특정한 위치를 식별하는 식별자이자 일종의 북마크 ex) #q=html5

3. URL 변경하기

3-1. 사용자가 다른 URL로 이동시켜야 할 때

location.href = 'http://egoing.net';
//location = 'http://egoing.net';

3-2. 현재 웹페이지 내용을 리로드하고 싶을 때

location.reload();
Previous사용자와 커뮤니케이션NextNavigator 객체

Last updated 2 years ago

Was this helpful?