Browser Object Model(BOM) refers to the objects provided by the web browser for manipulating properties and objects associated with it. The objects and properties provided by the Browser Object Model allow javascript to interact with the browser.
Some of the important BOM(Browser Object Model) objects which are available while executing javascript are:
- window
- window.document
- window.navigator
- window.screen
- window.history
- window.location
window
The window object represents the browser’s window containing the web document. It is the root object of the BOM hierarchy. To view properties and objects it contains execute the below code in your browser console.
//window object
console.log(window)
window.document
The document object represents and returns the reference of the document loaded in the browser’s window.
//title of the loaded document in the window
console.log(window.document.title)
window.navigator
The window.navigator object returns the reference to the Navigator Object. Navigator Object contains information about the user agent(browser) and the operating system.
//To get the User-Agent
console.log(window.navigator.userAgent)
window.screen
The window.screen object returns information about the user’s screen.
//get screen width
console.log(window.screen.width)
//get screen height
console.log(window.screen.height)
window.history
The window.history returns a reference to the History Object. You can use it for manipulating browser session history(pages visited in the same tab).
// go to previous web page, equivalent to clicking back button
window.history.back();
window.location
You can get the current page address(URL) or redirect the browser to a new web address using the window. location object.
//current page web address
console.log(window.location.href)