JavaScript Window - Browser Object Model

JavaScript Window - Browser Object Model

The Browser Object Model (BOM) gives JavaScript the ability to "talk" to the browser.

Browser Object Model (BOM)

There is no formal standard for the Browser Object Model (BOM).

Methods and properties are often considered BOMs since modern browsers have implemented (almost) the same methods and properties for JavaScript interactivity.

Window object

All browsers support the window object. It represents the browser window.

All JavaScript global 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 of the HTML DOM is one of the properties of the window object:

window.document.getElementById("header");

Same as this:

document.getElementById("header");

Window size

There are three methods to determine the size of the browser window (the browser's viewport, excluding toolbars and scroll bars) .

For Internet Explorer, Chrome, Firefox, Opera and Safari:

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

For Internet Explorer 8, 7, 6, 5:

document.documentElement.clientHeightdocument.documentElement.clientWidth

or

document.body.clientHeightdocument.body.clientWidth

Other Window methods

Some other methods:

window.open() - Open a new window window.close() - Close the current window window.moveTo() - Move the current window window.resizeTo() - Adjust the size of the current window