JavaScript learning 3: Explanation of JavaScript browser object model-document Object

 

 

The document object is a property of a windows Object, indicating the page document loaded in the current browser. Document objects are common objects of BOM and DOM (document Object Model, which will be explained in detail later.

Because BOM does not have a uniform standard, the document Object Features of various browsers are not exactly the same. Therefore, when using document objects, you need to consider browser compatibility and try to use the attributes supported by various browsers.

1. Common attributes

• Document. bgColor page background color
• Foreground color of document. fgColor page
• Document. linkColor page document connection color
• Document. vlinkColor the link color accessed in the document
• Activation link color in document. alinkColor

Note: These five attributes are not recommended, and some old features are used according to W3C standards.

• Document. domain get the domain Name of the document
• Document. referrer introduces the user to the URL of the current page
• Document. URL of the current page
• Document. title the title of the current page
• Document. lastModified last modification page time
• Document. set or retrieve the cookie value

Cookie is one of the methods for passing parameters between different pages. It is also a common method for storing data on the client. You can set the document. Cookie attribute directly to set the Cookie. The Cookie is saved as plain text.

A string in the form of several key-value pairs (name = value). Multiple key-value pairs are separated by semicolons. For example, name = Lao Deng; password = 1234; in addition, you can add special attributes to the Cookie string. Cookies support the following attributes:

Expires = date: Indicates the Cookie expiration time. If this attribute is not set, the Cookie will be deleted when the browser is closed. If expires sets a future time, the Cookie can be used before this time. If expires is set to a previous time, the Cookie will be deleted immediately.

Domin = dominName:Indicates the security domain that allows access to the Cookie. By setting this attribute, the Cookie value can be shared among multiple domains.

Path = allowPath:Indicates the server path that allows access to the Cookie. Only the pages under this path can access the Cookie.

Secure:Indicates that the Cookie is secure. Only websites in the security domain can access the Cookie.

When using cookies, note that the maximum length allowed for storing cookies is 4 kb. Therefore, you can only save a small amount of data in cookies. In addition, the browser may disable cookies, therefore, key parameters or data are not stored in cookies. The following are two common Cookie functions:

1 /***
2 * Set Cookie
3 * @ // <param name = "cookieName" type = "string"> Cookie name </param>
4 * @ // <param name = "cookieValue" type = "string"> Cookie value </param>
5 * @ // <param name = "cookieDay" type = "number"> Cookie Expiration days </param>
6 */
7 function SetCookie (cookieName, cookieValue, cookieDay ){
8 // current date
9 var today = new Date ();
10
11 // Cookie expiration time
12 var expire = new Date ();
13
14 // If the cookieDay parameter is not set or the cookieDay value is 0, the default value is 1.
15 if (cookieDay = null | cookieDay = 0 ){
16 cookieDay = 1;
17}
18
19 // calculate the Cookie expiration time
20 expire. setTime (today. getTime () + 3600000*24 * cookieDay );
21
22 // set the Cookie value
23 document. cookie = cookieName + "=" + escape (cookieValue) + "; expire =" + expire. toGMTString ();
24}
25
26 /***
27 * read the specified Cookie value
28 * @ // <param name = "cookieName" type = "string"> Cookie name </param>
29 */
30 function readCookie (cookieName ){
31 // Cookie string
32 var cookieString = "" + document. cookie;
33
34 // locate the cookieName location
35 var find = cookieString. indexOf (cookieName );
36
37 // If cookieName is found, an empty string is returned.
38 if (find =-1 | cookieName = ""){
39 return "";
40}
41
42 // determine the position of the semicolon
43 var index = cookieString. indexOf (';', index );
44 if (index =-1 ){
45 index = cookieString. length;
46}
47
48 // read the Cookie value
49 return unescape (cookieString. substring (find + cookieName. length + 1, index ));
50}

2. Set attributes

The document object has the attributes of some collection classes. You can use the collection attributes to obtain all similar HTML elements on the current page.

Attribute	Description
Anchors	Returns the set of all anchors in the document. Description: document. anchors in IE will return the anchor with the name or ID attribute, and the anchor with the name attribute will be returned in firefox.
Applets	Returns the set of all applets in the document.
Embeds	Returns the set of all embeds objects in the document.
Forms	Returns the set of all forms in the document.
Images	Returns the set of all img objects in the document.
Links	Returns the set of all links in the document, that is, all <a> element methods with the href attribute set.

3. Method

• Document. write/document. writeln outputs text in the current document. The difference between the two is that writeln attaches a linefeed \ n after the output text.
• Document. open document
• Document. close the document and output the written content to the page.

　　　　

　　The document object is actually not very complex. The key is to practice a lot, so it is OK to make it happen. Next I will continue to explain the location, screen, navigation, and history objects.