A probe into the DOM of JAVASCRITPT (i)

Source: Internet
Author: User

The DOM (Document Object model) is an API for HTML and XML documents.

The DOM depicts a hierarchical tree of nodes. Agree to the developer to join, remove and change a portion of the page. Dom was born out of Microsoft's DHTLM (Dynamic HTML), but today it has become a truly cross-platform, language-neutral way of showing and manipulating page markings.

JavaScript and Dom are often treated as a single entity, because JavaScript is the most common use for this purpose (interacting with content on the web). Use the DOM API to access, traverse, and manipulate HTML and XML documents.

Basic outline hierarchy (simplification) of a typical Dom

Here's a few notable things about the DOM:

  • Form object as a global object, you simply need to type "form" to access it.

    Run the JavaScript code in all of this object. Properties and methods like all objects.

    • A property is a variable stored in an object.

      All the variables created on the page authomatically become properties of the form object.

    • A method is a function that is stored in an object. All of the functionality has been stored at the form object (at least) and they can be called "methods".
  • The DOM creates a Hierarcy corresponding to each Web document's structure.

    Such hierarchies are made up of nodes. There are several different types of DOM nodes, the most important being "elements", "text" and "Documents".

    • An "element" node represents an element in a page. Suppose you have a paragraph element ("< p >"), then it can be visited by the DOM node.
    • The text node represents all the text (elements) within a page.

      So suppose that the text of your paragraph can be directly visited by the DOM.

    • The node of the document represents the entire document.

      (This is the root node of the DOM hierarchy/tree).

    • Also note that the element attribute is the DOM node itself.
  • each layout engine implements a slightly different DOM standard. For example,Firefoxusing a Web browserGeckolayout engine, there is a very good implementation (although not fully inline with the specifications)Internet Explorer, it usesTridentThe layout engine is famous for cars and incomplete implementations that lead to much pain within the web development community!
node Type:

The Dom1 class defines a node interface. The interface will be implemented by all node types in the DOM. This node interface is implemented as a node type in JavaScript, except IE. This type is available in all other browsers. All nodes in JavaScript inherit from the node type, so all node types share the same basic properties and methods.

Each node has a NodeType property. Used to indicate the type of node. The node type is represented by the following 12 numeric constants defined in the node type, regardless of what node type must reside:

Node.element_node (1); Node.attribute_node (2); Node.text_node (3); Node.cdata_section_node (4); Node.cdata_reference_node (5); Node.entity_node (6); Node.processing_instruction_node (7); Node.comment_node (8); Node.document_node (9); NODE. Document_type_node (10); Node.document_fragment_node (11); Node.notation_node (12)

By comparing these constants above. The ability to determine the type of a node very easily, such as:

<! DOCTYPE html>

to learn about node nodes, you can use both the NodeName and NodeValue properties:

<script type= "Text/javascript" >  var somenode=document.getelementbyid (' a '); alert (Somenode.nodetype); alert (somenode.nodename); is the label name of the element <p>alert (Somenode.nodevalue); To insist that node is not an element simply depends on the value of NodeValue NULL to be able to </script>


A probe into the DOM of JAVASCRITPT (i)

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.