Home > Developer > JavaScript
First, the basic concept
This is part of the so-called "HTML DOM", the so-called HTML DOM is the Web page loading rules, is a rule, that is, the basic formula of the page composition.
That is, all pages must follow:
The so-called "Web Node", also known as the "Dom node" of the popular interpretation, such as the content under the HTML node is
The HTML DOM is defined as: 1, the entire document is a document node, 2, each HTML tag (meaning <body><table> and other HTML tags, rather than simple
For example, a page can be drawn as the following DOM node tree:
The official definition of the HTML DOM is as follows: The HTML DOM is an abbreviation for the HTML Document Object Model (the document html/xhtml), and the HTML DOM is a Document object model specifically for use with the. People who are familiar with software development can interpret the HTML DOM as a Web page's API. It considers each element in a Web page to be an object, so that the elements in the Web page can also be acquired or edited by the computer language. For example, JavaScript can make use of HTML DOM to dynamically modify Web pages.
The use of JavaScript can be easily for these DOM nodes to make Web node additions and deletions to change the control.
II. Basic Objectives
Use JavaScript to add and check the nodes of a webpage. In a Web page, there are:
1, "Add Node" button, this button increases the node at the same time, the "replace button" associated with the drop-down menu in the node option. If there are 9 nodes in the page, the add and popup warnings are not allowed.
2, "Delete last Node" button, this button reduces the node at the same time, reduce the "replace button" associated with the drop-down menu in the node option.
3, "Replace node Content" button, first select the node that needs to operate, and then enter the content to replace, will replace the corresponding node.
4. If there are no nodes in the Web page, do not let the deletion and replacement, and pop the window warning.
Third, the production process
Do not configure any environment, directly in the page to write the following code, the specific code is as follows, the following part of the description:
<! DOCTYPE HTML PUBLIC "-//W3C//PD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/pD/xhtml1-transitional.dtd" >
1. <body> node<body> <!--button X2, both buttons have an OnClick action pointing to the corresponding function--><input type= "button" value= "Create Node" onclick= " CreateNode () "/><input type=" button "value=" Delete last Node "onclick=" Removenode () "/> <!--a no <option > The drop-down menu for the child node, which is added by the CreateNode () node simultaneously. --><select id= "number" ></select> <!--input box x1, note set Id,replacenode () to take the value of this text box--><input Type= "Text" id= "text"/> <!--button X1, same as button x2--><input type= "button" value= "Replace node contents" onclick= " ReplaceNode () "/> <!--an empty layer with nothing, as the parent node of <p>, the <p> is the child node of this <div> node--><div id=" D " ></div></body>2.
"JavaScript" Web node additions and deletions
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
