JS MASTER CLASS /// MASTER THE BOM /// WINDOW OBJECT /// LOCATION /// HISTORY /// JS MASTER CLASS /// MASTER THE BOM /// WINDOW OBJECT /// LOCATION /// HISTORY ///

JavaScript BOM

Gain ultimate control over the browser window. Redirect URLs, inspect history, and extract client data natively.

bom.js
1 / 15
12345
🪟

Tutor:Welcome to the BOM! The Browser Object Model. Unlike the DOM, which deals with the document (HTML), the BOM deals with the browser window itself.


Skill Matrix

UNLOCK NODES BY MASTERING OBJECTS.

Concept: Window

The window object represents the global context. Everything happens inside it.

System Check

Is the 'document' object a property of the 'window' object?

Community Holo-Net

Share Your Scripts

ACTIVE

Built an interesting window manipulation script? Share it with other devs!

Support Us

JavaScript BOM (Browser Object Model)

Author

Pascual Vila

Frontend Instructor // Code Syllabus

There are no official standards for the Browser Object Model (BOM), but modern browsers have implemented (almost) the same methods and properties for JavaScript interactivity.

The Window Object

The window object is supported by all browsers. It represents the browser's window. All global JavaScript objects, functions, and variables automatically become members of the window object. Even the document object (of the HTML DOM) is a property of the window object!

  • window.innerHeight - the inner height of the browser window
  • window.innerWidth - the inner width of the browser window

Location Object

The window.location object can be used to get the current page address (URL) and to redirect the browser to a new page.

  • location.href returns the href (URL) of the current page
  • location.hostname returns the domain name of the web host
  • location.assign() loads a new document

History Object

The window.history object contains the browsers session history. To protect the privacy of the users, there are strict limitations on how JavaScript can access this object.

  • history.back() - equivalent to clicking back in the browser
  • history.forward() - equivalent to clicking forward in the browser
View Additional BOM Objects+

Navigator: The window.navigator object contains information about the visitor's browser (e.g., navigator.appName, navigator.userAgent).

Screen: The window.screen object contains information about the visitor's screen (e.g., screen.width, screen.height).

Popups: JavaScript has three kind of popup boxes: Alert box, Confirm box, and Prompt box. They are all methods of the window object.

BOM Glossary

Window

The global object in a browser. Represents the browser tab/window.

snippet.js

Location

Object containing information about the current URL and methods to navigate.

snippet.js

History

Object allowing manipulation of the browser session history (pages visited in the tab).

snippet.js

Navigator

Object containing state and identity of the user agent (browser).

snippet.js

Screen

Object representing a screen, usually the one on which the current window is being rendered.

snippet.js

Timing Events

Methods on the window object to execute code at specified time intervals.

snippet.js