JavaScript BOM (Browser Object Model)

The BOM gives JavaScript access to browser features outside the page’s HTML. Use it to interact with the window, location, history, screen, and dialogs.

1) window Object

Global object for browser JS. Access properties like inner size and scroll.


console.log('Width:', window.innerWidth);
console.log('Height:', window.innerHeight);
window.scrollTo(0, 100);
Try it Yourself »

2) navigator

Browser information (user agent, online status, platform).


console.log(navigator.userAgent);
console.log(navigator.onLine);
Try it Yourself »

3) location

Work with the page’s URL. Reload or redirect.


console.log(location.href);
// location.reload();
// location.href = 'https://codingwithsonu.com';
Try it Yourself »

4) history

Move through browser history.


// history.back();   // go back
// history.forward(); // go forward
Try it Yourself »

5) screen

Info about the device screen.


console.log(screen.width, screen.height);
console.log(screen.colorDepth);
Try it Yourself »

6) alert / confirm / prompt

Show dialogs to the user.


alert('Hello!');
const ok = confirm('Are you sure?');
const name = prompt('Your name:');
Try it Yourself »

7) Timers: setTimeout & setInterval

Run code after a delay, or repeatedly at intervals.


setTimeout(() => {
  console.log('Runs once after 1s');
}, 1000);

let id = setInterval(() => {
  console.log('Repeats every 2s');
}, 2000);

// clearInterval(id); // stop it
Try it Yourself »
Tip: The BOM differs across browsers. Use feature detection (check if a property exists) before relying on it.