location Object
location Object 에는 현재 URL에 대한 정보가 들어 있습니다. URL에 대한 정보란 현재 페이지의 herf, path, pathname, protocol, host, port 등에 대한 정보가 들어 있는데, 이러한 정보들을 문자열로 return 받을 수 있습니다.
location Object 의 Property
| location Object Property |
| Property |
설 명 |
| hash |
문서내의 anchor(href 속성값 뒤에 붙이는 # 와 anchor name) name 지정 또는 return |
| host |
문서내의 hostname과 port 번호 지정 또는 return |
| hostname |
문서내의 hostname 지정 또는 return |
| href |
Default. 전체 URL을 지정 또는 return. location 뒤를 생략하면 location.herf와 같음. |
| pathname |
hostname을 제외한 나머지 문서의 경로와 filename 지정 또는 return |
| port |
URL에서 사용하는 port 번호 지정 또는 return |
| protocol |
URL에서 사용되는 protpcol(http:, ftp: 등등) 지정 또는 return |
| search |
입력값 전송과 관련된 URL 뒤에 붙는 ? (물음표) 이후의 문자열 지정 또는 return |
location Object 예제 <body>
<a href="http://www.location.net/sample.html#location_object" id="http1">http1</a><br />
<a href="http://www.location.net/doc.asp?filename=search" id="http2">http2</a><br />
<br />
<script type="text/javascript">
<!--
document.write("<b>href</b> : " + location.href + "<br />")
document.write("<b>pathname</b> : " + location.pathname + "<br />")
document.write("<b>protocol</b> : " + location.protocol + "<br />")
document.write("<b>host</b> : " + location.host + "<br />")
document.write("<b>hostname</b> : " + location.hostname + "<br />")
document.write("<b>hash</b> : " + http1.hash + "<br />")
document.write("<b>port</b> : " + http1.port + "<br />")
document.write("<b>search</b> : " + http2.search + "<br />")
// -->
</script>
</body>
location Object Method
location Object의 reload() Method 는 브라우저 창에서 우클릭 후 선택하는 '새로 고침' 과는 다릅니다. 새로 고침(refresh)는 문서에서 새로 고침을 할 때의 위치에서 새로 고침이 되지만 reload는 문서의 처음(top)으로 이동 됩니다.
| location Object method |
| Method |
설 명 |
| reload(boolean) |
| 새로 고침, 문서를 다시 읽습니다. |
| false |
Default. 브라우저 cache에서 다시 읽어 온다. |
| true |
서버에서 다시 읽어 온다. | |
location Object 예제 <body>
<button onclick="window.location.reload(false)">reload from browser cache</button>
<button onclick="window.location.reload(true)">reload from server</button>
</body>
location Object를 사용하여 Link 걸기
select - option 으로 만든 drop down box의 값은 onChange event로 선택합니다. 아래의 코드 중 selectedIndex 는 drop down box 중에 선택된 option Element의 value 속성 값을 의미합니다. 또한 window.location.href 에서 앞의 window와 location Object의 Default 값인 href 는 생략 가능합니다.
Source code
<body>
<select onchange="window.location.href=this.options[this.selectedIndex].value">
<option>검색 사이트</option>
<option value="http://kr.yahoo.com/">yahoo</option>
<option value="http://www.naver.com/">naver</option>
<option value="http://www.empas.com/">empas</option>
</select>
</body>
