JavaScript Browser Object One Window object Detail _ Basics

JavaScript provides a set of window-focused objects that enable access control to the browser window. 6 of important objects are defined in javascript:

The Window object represents the windows that are open in the browser;

The Document object represents the documentation object that loads the page in the browser;

The Location object contains the current URL information for the browser;

The navigation object contains information about the browser itself;

The Screen object contains information about the client screens and rendering capabilities;

The History object contains historical information about the browser's access to the Web page.

In addition to the Window object, the other 5 objects are properties of the Window object, and their relationships are as follows:

One, Window object

The Window object is the global object of JavaScript, so the properties and methods of using the Window object do not need to be specified specifically. For example, alert, in fact, the complete call is Window.alert, and usually omits a reference to the Window object.

1. Properties, methods, and events for Windows objects

Properties of Window objects

Property name	Role	Demo
Name	Specify the name of the window
Parent	The parent window of the current window (frame) that uses it to return the object's methods and properties
Opener	Returns the Window object that produces the current window, using it to return the object's methods and properties
Top	Represents the main window, is the topmost window, and is the parent window for all other windows. The methods and properties of the current window can be accessed through this object
Self	Returns an object in the current window through which to access the methods and properties of the current window
Defaultstatus	Returns or sets the default content that will be displayed in the browser status bar
Status	Returns or sets the specified content that will be displayed in the browser status bar

method of Window object

Method name	function	Demo
Alert ()	Displays a warning dialog box that contains a message and a confirmation button
Confirm ()	Display a confirmation dialog box
Prompt ()	Displays a prompt dialog box that prompts the user to enter data
Open ()	Open a window that already exists, or create a new window and load a document in that window
Close ()	Close an open window
Navigate ()	Displays the specified page in the current window
SetTimeout ()	Set a timer to call a function after a specified interval
Cleartimeout ()	Resets the specified timer
Focus ()	To get the current focus on a Window object
Blur ()	Causes a Window object to lose the current focus

Window object Events

Event	Description	Demo
OnLoad	Occurs when an HTML file is loaded into the browser
OnUnload	Occurs when an HTML file is deleted from the browser
onfocus	Occurs when the window receives focus
Onblur	Occurs when the window loses focus
OnHelp	Occurs when the user presses the F1 key
OnResize	Occurs when the user adjusts the window size
Onscroll	Occurs when the user scrolls the window
OnError	Occurs when an error occurred loading an HTML file

2. Window objects provide the main features:

Adjust the size and position of the window, open a new window, the System prompt box, status bar control, timed operation, the following 5 features in detail.

(1) Adjust the size and position of the window

Method	Usage	Description
Window.moveby Moves the browser window to the specified location (relative positioning)	Window.moveby (Dx,dy)	For security and good user considerations, JavaScript scripts are not allowed to move windows beyond the viewable area, and the browser window must always be visible on the screen.
Window.moveto Move the browser window to the specified location (absolute positioning)	Window.moveby (X,y)	If you specify a coordinate (x,y) that places some or all of the windows outside the viewable area, the window stays closest to the edge of the screen.
Window.resizeby Changes the size of the browser window to the specified width and height (relative resizing of the window)	Window.resizeby (DW,DH)
Window.resizeto Change the size of the browser window to the specified width and height (absolute resize window)	Window.resizeto (W,H)	The width and height specified cannot be negative

(2) Open a new window

Usage: window.open ([url],[target],[options])

Parameter URL: Opens the URL that the new window will load. If no parameters are specified, blank pages are loaded by default. such as: window.open ("test.htm");

Parameter target: the location target or name of the newly opened window

_self Load a new page in the current window

_blank Load new page in new window

_parent Load new page in parent window

_top load new page in top window

Argument options: The properties of a newly opened window are made up of several options, separated by commas, each containing the name and value of the option.

Options	Description
Height	Height of the window, per pixel
Width	Width of the window, per pixel
Left	The left edge position of the window
Top	Top edge position of window
Fullscreen	is full screen, default value No
Location	Whether the address bar is displayed and the default value Yes
MenuBar	Whether the menu bar is displayed and the default value Yes
Resizable	Whether to allow changes to window size, default value Yes
ScrollBars	Whether scroll bars are displayed, default value Yes
Status	Whether the status bar is displayed and the default value Yes
TitleBar	Whether to display the title bar, the default is Yes
Toolbar	Whether the toolbar is displayed and the default value Yes

(3) System prompt Box

Window.alert Displays the message prompt box, usage window.alert ([message]); ( Note: The Window object is generally omitted, using alert directly)

WINDOW.CONFIRM displays a confirmation dialog box, which includes the OK and Cancel buttons.

WINDOW.PROMPT displays a message balloon that contains a text entry box.
Usage: window.prompt ([Message],[default]); The message is the text that appears on the prompt box, and default is to set the text box defaults.

(4) Status bar control

Controlled by the Window.status property. such as:window.status= "error hint" ; This can affect the user experience, so it is not recommended to modify the status bar information.

(5) timed operation

Timing operation is a common function in web development, in the development of Ajax technology, there is a class of applications that require regular access to the backend server and update the foreground page, such applications usually depend on the timing operation function.

There are four timer operation functions:window.setinterval, Window.clearinterval, Window.settimeout, Window.cleartimeout, These four functions are all methods of the Window object, which means that the timer operation in the browser is done by the browser window. The following is a detailed introduction to the usage of these four methods.

①window.setinterval sets the timer, executes the specified code window.setinterval (code,time) at intervals;

Description: The code parameter can be a function, or it can be a string form of JavaScript code

The time parameter is the interval at which code is executed, in units of Ms.

②window.clearinterval clears the Timer window for the setinterval function setting. Clearinterval (time);

③window.settimeout sets the timer, executes the specified code window.settimeout (code,time) at intervals;

Description: The code parameter can be a function, or it can be a string form of JavaScript code, settimeout and setinterval differ in settimeout Executes only once for the specified code.

The time parameter is the interval at which code is executed, in units of Ms.

④window.cleartimeout clears the Timer window for the Settiimeout function setting. Cleartimeout (time);

Above this JavaScript browser object one of the Window object is small series to share all the content, hope to give you a reference, but also hope that we support the cloud habitat community.