Window location - Referensi javascript

JavaScript menyediakan berbagai metode untuk bekerja dengan URL halaman web. Salah satu metode paling penting adalah window.location. Melalui artikel ini, kita akan memahami dan belajar bagaimana menggunakan antarmuka window.location dalam JavaScript.

Apa itu Window location dalam JavaScript?

window.location adalah objek bawaan dalam JavaScript yang digunakan untuk mendapatkan informasi tentang lokasi dokumen saat ini atau URL. Objek ini juga dapat digunakan untuk merubah URL dan mengarahkan pengguna ke URL yang berbeda.

Bagian-bagian Window location

Sebuah URL terdiri dari beberapa bagian, dan masing-masing bagian dapat diakses menggunakan properti objek window.location. Berikut ini adalah properti-properti tersebut:

href: Mengembalikan seluruh URL
protocol: Mengembalikan protokol web yang digunakan (http: atau https:)
host: Mengembalikan hostname dan nomor port
hostname: Mengembalikan nama host saja
port: Mengembalikan nomor port saja
pathname: Mengembalikan path dan nama file dari URL
search: Mengembalikan query string dari URL
hash: Mengembalikan anker dari URL

Contoh Penggunaan Window location

Berikut adalah beberapa contoh penggunaan dasar window.location.

// Mengambil seluruh URL
var url = window.location.href; 
console.log(url);

// Mendapatkan nama host
var host = window.location.hostname; 
console.log(host);

Mengarahkan ke URL yang berbeda

Kita tidak hanya dapat mengambil informasi tentang URL saat ini, tetapi juga dapat mengubah URL saat ini dan mengarahkan pengguna ke URL baru.

// Mengarahkan pengguna ke URL baru
window.location.href = "https://www.w3schools.com";

Window location reload

Metode window.location.reload() digunakan untuk memuat ulang sumber daya saat ini dari server. Kamu juga dapat menggunakan ini untuk memuat ulang halaman.

// Memuat ulang halaman
window.location.reload();

Harap dicatat bahwa perilaku dari methode ini seperti mengklik tombol refresh di browser kamu.

Melalui pemahaman kita tentang window.location JavaScript, kita dapat lebih efektif dalam berinteraksi dengan URL dan merubahnya sesuai kebutuhan. Jadi, jangan ragu untuk bereksperimen dan mengaplikasikan dalam proyekmu!