JavaScript Learning 8:dom Advanced

There are many types of Dom itself, and we mentioned most of the types in the previous blog, such as the element type: a node of elements, such as the text type: Represents a literal node. The DOM also provides some extended functionality.

A Dom Type

In the previous blog, we learned about the nodes of Dom and how to manipulate and query nodes, and these different nodes have different types.

We'll take a look. Two types: Document type and element type

Document types represent documents, or the root node of a document, while this node is hidden, with no specific element tags.

The element type is used to represent the elements node in the HTML. In previous articles, we have been able to find, create, and manipulate element nodes, and the element node's NodeType is 1,nodename as the tag name of the element.

An element node object in a non-IE browser can return the object type of its concrete element node.

Two Dom Extension

1 Rendering Mode

Starting from IE6 the standard mode and promiscuous mode (weird mode), mainly look at the document declaration. IE adds a property named Compatmode to the Document object, which identifies the mode in which the IE browser's documents are located. If it is in standard mode, Css1compat is returned and Backcompat is returned if it is promiscuous mode.

2 scrolling

The DOM provides some ways to scroll the page, as follows:

document.getElementById (' box '). scrollIntoView ();

3 Children Properties

Because of child node whitespace issues, IE and other browsers explain different. Although it can be filtered out, if you get a valid child node, you can use the Children property, the supported browsers are: ie5+,firefox3.5+, and so on.

4 contains () method

To determine whether a node is a descendant of another node, we can use the contains () method. This method is the first use of IE, developers do not need to traverse to get this information.

Three Dom Action Content

1 InnerText Properties

In addition to Firefox, this method is supported by other browsers. But Firefox's DOM3 class provides another similar attribute: Textcontent, which is compatible, is universal.

2innerHTML Properties

This attribute we introduced before, do not reject HTML. Although it is possible to insert HTML, there are some limitations, the so-called scope elements, that are not valid for leaving this scope.

3outerText

Outertext in the value of the same time as InnerText, Firefox also does not support, and the assignment method is quite dangerous, he not only replaced the text content, but also the element directly erased.

4outerHTML

This use, like innerHTML, should be done with caution when assigning values.

JavaScript Learning 8:dom Advanced