DOM object (window, Navigator, screen, history, location + document)
Window objectWindow objects are top-level objects in the Javascript level.
A window object represents a browser window or framework.
The window object is automatically created every time <body> or <frameset> appears.
A detailed description of the window object.
IE:Internet Explorer,F:Firefox,O:Opera.
Set of window objects| Collection | Description | IE | F | O |
|---|---|---|---|---|
| Frames [] | Return to all named frameworks in the window. This set is an array of window objects. Each window object contains a frame or <IFRAME> in the window. The frames. Length attribute stores the number of elements contained in the array frames. Note that frames referenced in the frames [] array may also contain frames, and they also have the frames [] array. | 4 | 1 | 9 |
| Attribute | Description | IE | F | O |
|---|---|---|---|---|
| Closed | Whether the window is closed. | 4 | 1 | 9 |
| Defaultstatus | Set or return the default text in the window status bar. | 4 | No | 9 |
| Document | Read-only reference to the document object. See document objects. | 4 | 1 | 9 |
| History | Read-only reference to the history object. Please specify the history object. | 4 | 1 | 9 |
| Innerheight | Return the height of the document display area in the window. | No | No | No |
| Innerwidth | Return the width of the document display area in the window. | No | No | No |
| Length | Set or return the number of frames in the window. | 4 | 1 | 9 |
| Location | The location object used for the window or frame. See location object. | 4 | 1 | 9 |
| Name | Set or return the window name. | 4 | 1 | 9 |
| Navigator | Read-only reference to the navigator object. Please specify the navigator object. | 4 | 1 | 9 |
| Opener | Returns a reference to the window in which the window is created. | 4 | 1 | 9 |
| Outerheight | Returns the external height of the window. | No | No | No |
| Outerwidth | Returns the external width of the window. | No | No | No |
| Pagexoffset | Set or return the X position in the upper-left corner of the current page relative to the window display area. | No | No | No |
| Pageyoffset | Set or return the Y position in the upper-left corner of the current page relative to the window display area. | No | No | No |
| Parent | Return to the parent window. | 4 | 1 | 9 |
| Screen | Read-only reference to the screen object. Please specify the screen object parameter. | 4 | 1 | 9 |
| Self | Returns a reference to the current window. It is equivalent to the window property. | 4 | 1 | 9 |
| Status | Set the text of the window status bar. | 4 | No | 9 |
| Top | Return to the top-level parent window. | 4 | 1 | 9 |
| Window | The window attribute is equivalent to the self attribute, which contains references to the window itself. | 4 | 1 | 9 |
|
A read-only integer. Declares the X and Y coordinates of the upper left corner of the window on the screen. IE, Safari, and Opera Support screenleft and screentop, while Firefox and Safari support screenx and screeny. | 4 | 1 | 9 |
| Method | Description | IE | F | O |
|---|---|---|---|---|
| Alert () | A warning box with a message and a confirmation button is displayed. | 4 | 1 | 9 |
| Blur () | Remove the keyboard focus from the top-Layer window. | 4 | 1 | 9 |
| Clearinterval () | Cancels the timeout set by setinterval. | 4 | 1 | 9 |
| Cleartimeout () | Cancels the timeout set by the setTimeout () method. | 4 | 1 | 9 |
| Close () | Close the browser window. | 4 | 1 | 9 |
| Confirm () | A dialog box with a message, a confirmation button, and a Cancel button is displayed. | 4 | 1 | 9 |
| Createpopup () | Create a pop-up window. | 4 | No | No |
| Focus () | Give the keyboard focus to a window. | 4 | 1 | 9 |
| MoveBy () | You can move the specified pixel relative to the current coordinate of the window. | 4 | 1 | 9 |
| MoveTo () | Move the upper left corner of the window to a specified coordinate. | 4 | 1 | 9 |
| Open () | Open a new browser window or find a named window. | 4 | 1 | 9 |
| Print () | Print the content of the current window. | 5 | 1 | 9 |
| Prompt () | The prompt dialog box is displayed. | 4 | 1 | 9 |
| ResizeBy () | Adjust the window size according to the specified pixel. | 4 | 1 | 9 |
| ResizeTo () | Adjust the window size to the specified width and height. | 4 | 1.5 | 9 |
| Scrollby () | Scroll the content based on the specified pixel value. | 4 | 1 | 9 |
| Scrollto () | Scroll the content to the specified coordinate. | 4 | 1 | 9 |
| Setinterval () | Calls a function or computing expression according to the specified period (in milliseconds. | 4 | 1 | 9 |
| SetTimeout () | Call a function or computation expression after a specified number of milliseconds. | 4 | 1 | 9 |
The window object indicates a browser window or framework. In client JavaScript, window objects are global objects, and all expressions are calculated in the current environment. That is to say, to reference the current window, there is no need for special syntax. You can use the properties of that window as a global variable. For example, you can write only the document, instead of the invalid Doc ument.
Similarly, you can use the method of the current window object as a function, such as writing only alert (), instead of window. Alert ().
In addition to the attributes and methods listed above, the WINDOS object also implements all the global attributes and methods defined by the core JavaScript.
The window attribute and self attribute of the window object reference itself. These two attributes can be used when you want to explicitly reference the current window, not just implicitly reference it. In addition to these two attributes, the parent attribute, top attribute, and frame [] array all reference other window objects related to the current window object.
To reference a framework in the window, you can use the following syntax:
Frame [I] // framework of the current window self. Frame [I] // framework of the current window W. Frame [I] // framework of the window W
To reference the parent window (or parent framework) of a framework, you can use the following syntax:
Parent // parent window of the current window self. Parent // parent window of the current window W. Parent // parent window of the window W
To reference it from any framework contained in the top-level window, you can use the following syntax:
Top // top-level window of the current framework self. Top // top-level window of the current framework F. Top // top-level window of framework F
The new top-layer browser window is created by window. open. When this method is called, the return values of open () should be stored in a variable, and then the variable should be used to reference the new window. The opener attribute of the new window references the window that opens it.
In general, the window object method is to perform some operation on the browser window or framework. The Alert () method, confirm () method, and prompt method are different. They interact with users through a simple dialog box.
Navigator objectThe navigator object is actually a JavaScript Object, not an html dom object.
The navigator object is automatically created by the Javascript runtime engine and contains information about the client browser.
IE:Internet Explorer,F:Firefox,O:Opera.
A set of Navigator objects| Set | Description | IE | F | O |
|---|---|---|---|---|
| Plugins [] | Returns a reference to all embedded objects in the document. This collection is an array of plugin objects, and the elements represent the plug-ins installed in the browser. The plug-in object provides information about the plug-in, including a list of supported MIME types. Although the Plugins [] array is defined by IE 4, it is always empty in IE 4, because IE 4 does not support plug-ins and plugin objects. |
4 | 1 | 9 |
| Attribute | Description | IE | F | O |
|---|---|---|---|---|
| Appcodename | Return the code name of the browser. | 4 | 1 | 9 |
| Appminorversion | Returns the secondary version of the browser. | 4 | No | No |
| Appname | Returns the name of the browser. | 4 | 1 | 9 |
| Appversion | Return the platform and version information of the browser. | 4 | 1 | 9 |
| Browserlanguage | Returns the language of the current browser. | 4 | No | 9 |
| Cookieenabled | Returns a Boolean value indicating whether the cookie is enabled in the browser. | 4 | 1 | 9 |
| Cpuclass | Returns the CPU level of the browser system. | 4 | No | No |
| Online | Returns a Boolean value indicating whether the system is in offline mode. | 4 | No | No |
| Platform | Return to the operating system platform that runs the browser. | 4 | 1 | 9 |
| Systemlanguage | Returns the default OS language. | 4 | No | No |
| Useragent | Returns the value of the User-Agent header of the server sent by the client. | 4 | 1 | 9 |
| Userlanguage | Returns the OS's natural language settings. | 4 | No | 9 |
| Method | Description | IE | F | O |
|---|---|---|---|---|
| Javaenabled () | Specifies whether the browser enables Java. | 4 | 1 | 9 |
| Taintenabled () | Specifies whether the browser enables data tainting ). | 4 | 1 | 9 |
The Screen Object is actually a JavaScript Object, not an html dom object.
The Screen Object is automatically created by the Javascript runtime engine and contains information about the display screen of the client.
The screen attribute of each window object references a screen object. The screen object contains information about the browser screen. Javascript programs will use this information to optimize their output to meet user display requirements. For example, a program can choose whether to use a large image or a small Image Based on the display size. It can also choose whether to use a 16-bit color or an 8-bit Color Image Based on the display color depth. In addition, the Javascript program can locate the new browser window in the middle of the Screen Based on the screen size information.
IE:Internet Explorer,F:Firefox,O:Opera.
Properties of the Screen Object| Attribute | Description | IE | F | O |
|---|---|---|---|---|
| Availheight | Returns the height of the displayed screen (except for the Windows taskbar ). | 4 | 1 | 9 |
| Availwidth | Returns the width of the display screen (except for the Windows taskbar ). | 4 | 1 | 9 |
| Bufferdepth | Sets or returns the bitdepth of the color palette in off-screen bitmap buffer. | 4 | No | No |
| Colordepth | Returns the bit depth of the palette on the target device or buffer. | 4 | 1 | 9 |
| Devicexdpi | Returns the number of horizontal points per inch on the screen. | 6 | No | No |
| Deviceydpi | Returns the number of vertical points per inch on the screen. | 6 | No | No |
| Fontsmoothingenabled | Returns whether font smoothing is enabled in the display control panel. | 4 | No | No |
| Height | Returns the screen height. | 4 | 1 | 9 |
| Logicalxdpi | Returns the regular number of points in the horizontal direction of the screen per inch. | 6 | No | No |
| Logicalydpi | Returns the number of regular points in the vertical direction of each inch of the screen. | 6 | No | No |
| Pixeldepth | Returns the color resolution (bits per pixel) of the display screen ). | No | 1 | 9 |
| Updateinterval | Set or return the screen update rate. | 4 | No | No |
| Width | Returns the screen width of the monitor. | 4 | 1 | 9 |
The history object is actually a JavaScript Object, not an html dom object.
The history object is automatically created by the Javascript runtime engine and consists of a series of URLs. These URLs are the URLs that you have accessed in a browser window.
The history object was originally designed to indicate the browsing history of the window. However, for privacy reasons, the History Object no longer allows scripts to access actual URLs that have already been accessed. Only the back (), forward (), and go () methods are supported.
The history object is part of a window object and can be accessed through the window. History attribute.
IE:Internet Explorer,F:Firefox,O:Opera.
Attributes of the History Object| Attribute | Description | IE | F | O |
|---|---|---|---|---|
| Length | Returns the number of URLs in the browser history list. | 4 | 1 | 9 |
| Method | Description | IE | F | O |
|---|---|---|---|---|
| Back () | Load the previous URL in the History List | 4 | 1 | 9 |
| Forward () | Load the next URL in the History List | 4 | 1 | 9 |
| Go () | Load a specific page in the history list | 4 | 1 | 9 |
The location object is actually a JavaScript Object, not an html dom object.
The location object is automatically created by the Javascript runtime engine and contains information about the current URL.
Example: bringing a user to a new address
The location object is a part of the window object and can be accessed through the window. Location attribute.
A detailed description of the location object.
IE:Internet Explorer,F:Firefox,O:Opera.
Location Object Attributes| Attribute | Description | IE | F | O |
|---|---|---|---|---|
| Hash | Set or return the URL (Anchor) starting with ). | 4 | 1 | 9 |
| Host | Set or return the host name and the port number of the current URL. | 4 | 1 | 9 |
| Hostname | Sets or returns the Host Name of the current URL. | 4 | 1 | 9 |
| Href | Set or return the complete URL. | 4 | 1 | 9 |
| Pathname | Sets or returns the path of the current URL. | 4 | 1 | 9 |
| Port | Set or return the port number of the current URL. | 4 | 1 | 9 |
| Protocol | Sets or returns the protocol of the current URL. | 4 | 1 | 9 |
| Search | Set or return the question mark (?) The start url (query part ). | 4 | 1 | 9 |
| Method | Description | IE | F | O |
|---|---|---|---|---|
| Assign () | Load new documents. | 4 | 1 | 9 |
| Reload () | Reload the current document. | 4 | 1 | 9 |
| Replace () | Replace the current document with a new one. | 4 | 1 | 9 |
The location object is stored in the location attribute of the window object, indicating the web address of the document currently displayed in that window. Its href attribute stores the complete URL of the document, while other attributes describe each part of the URL. These attributes are very similar to the URL attributes of the anchor object (or area object. When a location object is converted to a string, the value of the href attribute is returned. This means that you can use the expression location to replace location. href.
However, the anchor object represents the hyperlink in the document, while the location object represents the URL (or location) of the document currently displayed by the browser ). However, the location object can do much more than this. It can also control the location of the document displayed by the browser. If you assign a URL-containing string to the location object or its href attribute, the browser will load the document referred to by the new URL and display it.
In addition to setting location or location. href to replace the current URL with the complete URL, you can also modify some URLs by assigning values to other attributes of the location object. In this way, a new URL will be created, and some of them are different from the original URL. the browser will load and display it. For example, if the hash attribute of the location object is set, the browser moves to a specified location in the current document. Similarly, if the search attribute is set, the browser will re-load the URL with the new query string appended.
Besides the URL attribute, the reload () method of the location object can reload the current document. Replace () can load a new document without creating a new historical record for it. That is to say, in the browser's history list, the new document replaces the current document.
HTML Dom Document ObjectThe document object represents the entire HTML document and can be used to access all elements on the page.
The document object is a part of the window object, which can be accessed through the expose Doc ument attribute.
A detailed description of the Document Object.
IE:Internet Explorer,F:Firefox,O:Opera,W3C:World Wide Web Consortium (Internet standard ).
Document Object set| Set | Description | IE | F | O | W3C |
|---|---|---|---|---|---|
| All [] | Provides access to all HTML elements in the document. | 4 | 1 | 9 | Yes |
| Anchors [] | Returns a reference to all anchor objects in the document. | 4 | 1 | 9 | Yes |
| Applets | Returns a reference to all the applet objects in the document. | - | - | - | - |
| Forms [] | Returns reference to all form objects in the document. | 4 | 1 | 9 | Yes |
| Images [] | Returns a reference to all image objects in the document. | 4 | 1 | 9 | Yes |
| Links [] | Returns reference to all area and link objects in the document. | 4 | 1 | 9 | Yes |
| Attribute | Description | IE | F | O | W3C |
|---|---|---|---|---|---|
| Body | Provides direct access to the <body> element. For documents that define a framework set, this attribute references the <frameset> of the outermost layer. | ||||
| Cookie | Sets or returns all cookies related to the current document. | 4 | 1 | 9 | Yes |
| Domain | Returns the Domain Name of the current document. | 4 | 1 | 9 | Yes |
| Lastmodified | Returns the date and time when the document was last modified. | 4 | 1 | No | No |
| Referrer | Returns the URL of the document that loads the current document. | 4 | 1 | 9 | Yes |
| Title | Returns the title of the current document. | 4 | 1 | 9 | Yes |
| URL | Returns the URL of the current document. | 4 | 1 | 9 | Yes |
| Method | Description | IE | F | O | W3C |
|---|---|---|---|---|---|
| Close () | Close the output stream opened using document. open () and display the selected data. | 4 | 1 | 9 | Yes |
| Getelementbyid () | Returns a reference to the first object with the specified ID. | 5 | 1 | 9 | Yes |
| Getelementsbyname () | Returns a set of objects with the specified name. | 5 | 1 | 9 | Yes |
| Getelementsbytagname () | Returns an object set with the specified tag name. | 5 | 1 | 9 | Yes |
| Open () | Open a stream to collect output from any document. Write () or document. writeln () method. | 4 | 1 | 9 | Yes |
| Write () | Write HTML expressions or JavaScript code to the document. | 4 | 1 | 9 | Yes |
| Writeln () | It is equivalent to the write () method. The difference is that a line break is written after each expression. | 4 | 1 | 9 | Yes |
The htmldocument interface extends the DOM Document Interface and defines HTML-specific attributes and methods.
Many Attributes and methods are htmlcollection objects (in fact, read-only arrays that can be indexed with arrays or names), which store references to the anchor, forms, links, and other Scriptable elements.
These set attributes are derived from level 0 Dom. They have been replaced by document. getelementsbytagname (), but they are often used because they are convenient.
The write () method is worth noting that when a document is loaded and parsed, it allows a script to insert dynamically generated content into the document.
Note that in level 1 Dom, htmldocument defines a very useful method named getelementbyid. In Level 2 Dom, this method has been transferred to the document interface, which is now inherited by htmldocument rather than defined by it.
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
