location Object | location Property


Home > Document > JavaScript > Object > Window > location Object

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>
코드 실행 하기





이 문서의 저작권은 www.cadvance.org 에 있습니다.

Top
Back
New
검색