ตำแหน่งหน้าต่าง JavaScript
สามารถ ใช้window.locationวัตถุเพื่อรับที่อยู่หน้าปัจจุบัน (URL) และเพื่อเปลี่ยนเส้นทางเบราว์เซอร์ไปยังหน้าใหม่
ตำแหน่งหน้าต่าง
window.locationสามารถเขียนวัตถุโดยไม่มีคำนำหน้าหน้าต่าง
ตัวอย่างบางส่วน:
window.location.hrefส่งคืน href (URL) ของหน้าปัจจุบันwindow.location.hostnameส่งคืนชื่อโดเมนของโฮสต์เว็บwindow.location.pathnameส่งคืนพาธและชื่อไฟล์ของเพจปัจจุบันwindow.location.protocolส่งคืนโปรโตคอลเว็บที่ใช้ (http: หรือ https:)window.location.assign()โหลดเอกสารใหม่
ตำแหน่งหน้าต่าง Href
คุณสมบัติwindow.location.hrefส่งคืน URL ของหน้าปัจจุบัน
ตัวอย่าง
แสดง href (URL) ของหน้าปัจจุบัน:
document.getElementById("demo").innerHTML =
"Page location is " + window.location.href;
ผลลัพธ์คือ:
Page location is https://th.pictoshow.com/js/js_window_location.asp
ตำแหน่งหน้าต่าง ชื่อโฮสต์
คุณสมบัติwindow.location.hostnameส่งคืนชื่อโฮสต์อินเทอร์เน็ต (ของหน้าปัจจุบัน)
ตัวอย่าง
แสดงชื่อโฮสต์:
document.getElementById("demo").innerHTML =
"Page hostname is " + window.location.hostname;
ผลลัพธ์คือ:
Page hostname is th.pictoshow.com
ชื่อเส้นทางตำแหน่งหน้าต่าง
คุณสมบัติwindow.location.pathnameส่งคืนชื่อพาธของเพจปัจจุบัน
ตัวอย่าง
แสดงชื่อพาธของ URL ปัจจุบัน:
document.getElementById("demo").innerHTML =
"Page path is " + window.location.pathname;
ผลลัพธ์คือ:
Page path is /js/js_window_location.asp
โปรโตคอลตำแหน่งหน้าต่าง
คุณสมบัติwindow.location.protocolส่งคืนโปรโตคอลเว็บของหน้า
ตัวอย่าง
แสดงโปรโตคอลเว็บ:
document.getElementById("demo").innerHTML =
"Page protocol is " + window.location.protocol;
ผลลัพธ์คือ:
Page protocol is https:
พอร์ตตำแหน่งหน้าต่าง
คุณสมบัติwindow.location.portส่งคืนหมายเลขพอร์ตโฮสต์อินเทอร์เน็ต (ของหน้าปัจจุบัน)
ตัวอย่าง
แสดงชื่อโฮสต์:
document.getElementById("demo").innerHTML =
"Port
number is " + window.location.port;
ผลลัพธ์คือ:
Port number is
เบราว์เซอร์ส่วนใหญ่จะไม่แสดงหมายเลขพอร์ตเริ่มต้น (80 สำหรับ http และ 443 สำหรับ https)
กำหนดตำแหน่งหน้าต่าง
วิธี การwindow.location.assign()โหลดเอกสารใหม่
ตัวอย่าง
โหลดเอกสารใหม่:
<html>
<head>
<script>
function newDoc() {
window.location.assign("https://www.w3schools.com")
}
</script>
</head>
<body>
<input type="button" value="Load new document"
onclick="newDoc()">
</body>
</html>