JavaScript Window - The Browser Object Model

The Browser Object Model (BOM)

The Browser Object Model (BOM) allows JavaScript to interact with the browser. There are no official standards for the BOM, but modern browsers have implemented similar methods and properties for JavaScript interactivity.

The Window Object

The window object is supported by all browsers and represents the browser's window. All global JavaScript objects, functions, and variables automatically become members of the window object.

• Global variables are properties of the window object.
• Global functions are methods of the window object.
• Even the document object (of the HTML DOM) is a property of the window object.

For example:

window.document.getElementById("header");‍is the same as:document.getElementById("header");

‍

Window Size

Two properties can be used to determine the size of the browser window in pixels:

• window.innerHeight: The inner height of the browser window.
• window.innerWidth: The inner width of the browser window.

These properties do not include toolbars and scrollbars.

Example:

let w = window.innerWidth;let h = window.innerHeight;

‍

Other Window Methods

Some other useful methods for the window object include:

• window.open(): Opens a new window.
• window.close(): Closes the current window.
• window.moveTo(): Moves the current window.
• window.resizeTo(): Resizes the current window.

‍