Window Properties and Methods Explained

In JavaScript, the BOM (Browser Object Model) refers to a set of objects provided by the browser, used for managing browser windows and documents. Among them, the window object is one of the most important objects in the BOM, representing the browser window.

The window object provides numerous properties and methods for manipulating the browser window and document. Below are some commonly used properties and methods of the window object:

  • window.document: Returns the document object for the current window, which can be used to access and manipulate the HTML and CSS of the page.
  • window.location: Returns URL information for the current window, which can be used to retrieve or modify the URL of the current page.
  • window.navigator: Returns information about the current browser, such as the browser name, version, operating system, etc.
  • window.history: Returns the browsing history for the current window, which can be used to control the browser's forward and backward navigation operations.
  • window.alert(): Displays a warning box in the browser window.
  • window.prompt(): Displays an input box in the browser window for obtaining user input.
  • window.confirm(): Displays a confirmation box in the browser window to obtain the user's confirmation or cancellation.

In addition to the above properties and methods, the window object provides many other properties and methods, such as timers, screen information, and browser window size. It is worth noting that properties and methods within the window object can be accessed directly without adding the object prefix; for example, window.alert() can be abbreviated as alert().

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>window</title>
</head>
<body>
<script>
    // Variables defined with 'var' are added to the global object
    var varVariable = "varVariable";
    // Variables defined with 'let' are not added to the global object
    let letVariable = "letVariable";
    function sayHi() {
        alert("Hi, window");
    }
    // Display varVariable in a popup
    alert(window.varVariable);
    // Display undefined in a popup
    alert(window.letVariable);
    window.sayHi();
</script>
</body>
</html>