Common properties and methods of BOM

BOM(Browser Object Model)

Refers to the browser object model, which is a model used to describe the hierarchical relationship between such objects and objects. The browser object model provides an object structure that is independent of content and can interact with the browser window. The BOM consists of multiple objects. The Window object representing the browser window is the top-level object of the BOM, and other objects are sub-objects of this object. - Baidu Encyclopedia

Mainly include the following:

window (browser window)

Browser window object, the main properties are:

• name: refers to the name of the browser window or the name of the frame. This name is used for the target attribute of the a tag. Set the name of the window: window.name = "newWin" Get the name of the window: document.write(name);
• top: Represents the topmost window. Such as: window.top
• parent: Represents the parent window, mainly used for frames.
• self: represents the current window, mainly used in the frame.
• innerWidth: refers to the inner width of the browser window (excluding menu bar, toolbar, address bar, status bar), this property is supported by chrome.
  Under IE, use

 document.documentElement.clientWidth  来代替 window.innerWidth  

• innerHeight: refers to the inner height of the browser window (excluding menu bar, toolbar, address bar, status bar), this property is supported by chrome.
  Under IE, use

  document.documentElement.clientHeight  来代替
  window.innerHeight  
  

  For example:
  document.documentElement is the html markup object
  document.body is the markup object

window method

• alert(): Pops up an alert dialog.
• prompt([text],[defaulttext]): pops up an input dialog.
• confirm(text): A confirmation dialog pops up. Returns true if "OK button" is clicked, false if "Cancel" is clicked. text: plain text to display
• close(): close the window
• print(): print window
• open([url],[name],[options]): open a new window
• Delayer: window.setTimeout("code", 1000);// code is generally a function, but placed under double quotation marks, the
  return value of 1000ms is the id of the delayer, which is used for clearTimeout
• Timer: window.setInterval("code", 1000);// code is generally a function, but under "", the
  return value of 1000ms is the id of the timer, which is used for clearInterval

location

location common properties

• href: Get the full address in the address bar. JS web page jump can be achieved. location.href = " http://www.sina.com.cn ";
• host: hostname
• hostname: hostname
• pathname: file path and file name
• search: The query string.
• protocol: protocol, such as: http://, ftp://
• hash: Anchor name. eg: #top
• reload([true]): Refresh the web page. The true parameter means a forced refresh

Note: After reassigning all properties, the web page will be automatically refreshed

screen

screen common properties:

• Width: The width of the screen, read-only property.
• Height: The height of the screen, read-only property.
• availWidth: The effective width of the screen, excluding the taskbar. Read-only property.
• availHeight: The effective height of the screen, excluding the taskbar. Read-only property.

navigator (browser software)

Common properties of navigator:

• appName: The name of the browser software, which is mainly used to determine what core browser the client is using.
  If it is IE browser, the return value is: Microsoft Internet Explorer
  If it is Firefox browser, the return value is: Netscape
• appVersion: The core version number of the browser software.
• systemLanguage: system language
• userLanguage: user language
• platform: platform

history (browsing history)

history common properties

• length: the number of historical records

Common methods of history

• go(n): "forward" and "backward" can be achieved at the same time.
  1. history.go(0) refresh the web page
  2. history.go(-1) backward
  3. history.go(1) forward one step
  4. history. go(3) go three steps forward
• forward(): Equivalent to the browser's "forward" button
• back(): Equivalent to the browser's "back" button
  

  ---

  
  The article is referenced at:
  
  • Chuanzhi php video
  • W3Cschool Frontend Databook