JavaScript Browser Object Model (BOM): Window, Location, History & Navigator

While the DOM provides access to the contents of a web page, the Browser Object Model (BOM) provides access to the surrounding web browser environment itself. The top-level root of the BOM is the window object.

The 4 Primary BOM Sub-Objects

1. window.location (URL & Navigation Control)

Inspects and directs browser navigation:

// Reading URL information
console.log(window.location.href);     // Full URL: "https://veewom.com/JavaScript/"
console.log(window.location.hostname); // "veewom.com"
console.log(window.location.pathname); // "/JavaScript/"
console.log(window.location.protocol); // "https:"

// Programmatic redirection
// window.location.href = "https://veewom.com/tutorials.htm";
// window.location.reload(); // Reloads current page

2. window.history (Session Navigation History)

window.history.back();    // Equivalent to clicking browser Back button
window.history.forward(); // Equivalent to clicking browser Forward button
window.history.go(-2);    // Jumps back 2 pages in history stack

3. window.navigator (Browser & Device Identity)

console.log(navigator.userAgent); // Browser identity string
console.log(navigator.language);  // User's default language (e.g. "en-US")
console.log(navigator.onLine);    // Boolean: true if connected to internet

4. window.screen (Physical Screen Resolution)

console.log("Device Screen Width:", window.screen.width);
console.log("Device Screen Height:", window.screen.height);
console.log("Available Screen Height:", window.screen.availHeight);