JavaScript Browser Object Model (BOM) is used to interact with the browser. It will help while developing web applications or websites.
You can call all the window functions by specifying the window directly.
window.alert("Hello JS");
// OR
alert("Hello JS");
You can use these window objects for controlling the lifecycle of the webpage, getting browser information, managing screen size, opening and closing the new browser windows, getting URL information or updating URL, getting cookies and local storage, etc.
The list of objects is called browser objects.
- Window – part of DOM API
- Navigator
- Document – part of DOM API
- Screen – property of Window object
- History – property of Window object
- Location – property of Window and Document object
Browser object in JavaScript
Simple example code.
<!DOCTYPE html>
<html>
<head>
<title>BOM Examples</title>
<script>
var browserInfo = window.navigator.appName + " " + window.navigator.appVersion;
document.write("<h2>Browser Info</h2><p>"+browserInfo +"</p>");
var newWindow;
function opennewWindow() {
newWindow = window.open("", "", "width=500, height=300, top=150, left=150");
newWindow.document.title = "New Window";
paraGraph = document.createElement("P");
paraGraph_text = document.createTextNode("New Paragraph");
paraGraph.appendChild(paraGraph_text);
newWindow.document.body.appendChild(paraGraph);
}
function closenewWindow() {
if (newWindow != undefined) {
newWindow.close();
newWindow = undefined;
}
else {
alert("Nothing to open !!");
}
}
</script>
</head>
<body>
<h2>BOM Window Object</h2>
<p>
<input type="button" value="Open Window" onclick="opennewWindow()" />
<input type="button" value="Close Window" onclick="closenewWindow()" />
</p>
</body>
</html>
Output:
Do comment if you have any doubts or suggestions on this JS object topic.
Note: The All JS Examples codes are tested on the Firefox browser and the Chrome browser.
OS: Windows 10
Code: HTML 5 Version