javascript location 객체의 속성과 메서드

javascript location 객체의 속성과 메서드

■ 자바스크립트 객체 중에서 location 객체는 현재 사용 중인 URL에 대한 정보를 읽어오거나 제어를 하는 역할을 하는데요. location 객체의 속성과 메서드에 대해서 정리해보고, 간단한 예제도 만들어 보겠습니다. 

 

 

 location 객체의 속성은 다음과 같습니다. 

1. hash: URL의 정보 부분

2. search: URL의 쿼리 부분

3. host: 호스트 이름과 폰트 번호

4. href: URL의 이동

5. pathname: URL에 포함된 경로 문자열

6. origin: 프로토콜, 호스트 이름, 폰트 번호    

7. protocol: 프로토콜(웹에서 사용하는 통신 형식)

8. port: 포트 번호

9. hostname: URL에 포함된 호스트 이름

■ 여러 가지 속성이 있지만, location 객체의 속성은 보통 다른 웹 페이지로 이동하거나 URL의 주소값을 불러올 때 주로 사용합니다. 여기서는 href 속성을 이용해서 다른 웹 페이지로 이동하는 예제를 만들어보겠습니다. 

■ aaa()라는 함수를 만들어서 그 안에 locatiob.href 속성을 이용해서 네이버로 이동하도록 하고 있구요. 버튼을 하나 만들어서 클릭했을 때 aaa() 함수가 실행되도록 하고 있습니다.

■ 당연히 이렇게 버튼이 나타나고, 클릭하면 네이버로 이동하게 됩니다. 간단한 내용이니까 메모장 열고 후다닥 입력해서 실행해보셔요. ^^

 다음은 location의 메서드를 알아보겠습니다. 

1. assign() : 새 문서 로드

2. reload() : 새로 고침

3. replace() : 현재 문서를 새로운 것으로 변경

■ 어떤 기능들인지 대충 아시겠죠? 이 중에서 reload() [새로 고침] 메서드를 사용하는 예제의 형식만 살펴보고 마무리할게요. 

■ 같은 예제에 location.reload()로 변경만 했습니다. 웹 문서를 실행해서 브라우저에서 버튼을 클릭하면 해당 페이지가 [새로 고침] 됩니다. ^^ 이 부분도 직접 확인해보셔요. 

 이렇게 해서 javascript 객체 중에서 location의 속성과 메서드의 종류를 알아봤습니다. 수고하셨어요.