You will notice in Figure 2 that one of the nodes in the Browser Object Model is called document. This is the Document Object Model shown in Figure 1. The web page described in the DOM is a part (sub-node) of the Browser Object!
Some of the core objects within the Browser Object Model include:
- Console — Access to the debugging console in the browser
- Document — Access to the HTML document object
- History — Access to the URLs in the browser history
- Location — Information about the current URL or file location
- Navigator — Information about the current browser
- Screen — Information about the screen being used
- Window — Access to the current open window in the browser
The core properties and methods include the following:
- Array — objects for storing multiple items in one variable
- Date — access to date and time routines
- Error — information about an error that occurred
- JSON — Java Object Notation — used for storing and sharing (transporting) data
- Math — Math routines
- RegExp — routines for working with pattern matching
- Storage — Access to the session storage and local storage for a domain
- String — routine sand such for storing and working with text
Listing 1: Using Browser Objects
<html> <body> <p>Object Information: </p> <script> document.write("Screen Height: " + window.screen.height + "<br/>"); document.write( "Screen Width = " + window.screen.width + "<br/>" ); document.write( "Window height = " + window.innerHeight + "<br/>" ); // browser document.write( "Window width = " + window.innerWidth + "<br/>" ); // browser document.write( "Location = " + window.location + "<br/>" ); </script> <br/> **** END *** </body> </html>
This will display either the URL or if you are running on a local machine, it will show the local file path. You can see that the screen node shown in
Figure 2 is also called from within Listing 1 to show the screen height and width. Figure 4 shows the output from running the listing locally on my system with a 4k monitor. Because the listing was running locally, a file name is shown for the location.
Figure 4: Output from listing 1.