How to use JavaScript to add, delete, modify, and query webpage nodes _ javascript skills

Source: Internet
Author: User
This article mainly introduces the use of JavaScript for adding, deleting, modifying, and querying webpage nodes. The example analyzes the skills of JavaScript to operate webpage nodes, which is of great practical value, for more information about how to add, delete, modify, and query webpage nodes using JavaScript, see the example in this article. Share it with you for your reference. The specific analysis is as follows:

I. Basic concepts

This part is the so-called "html dom". The so-called html dom is the Web page loading rule. it is a rule, which is also the basic formula of webpage composition.

That is, all webpages must follow the following rules:...... According to these rules.

The so-called "webpage node" is also known as the "DOM node". for example, the content under an html node isAnd the content under the body node is.

The html dom is defined as follows: 1. the entire document is a document node; 2. Each HTML tag (meaning


The official definition of html dom is as follows: html dom is the abbreviation of HTML Document Object Model (Document Object Model), and html dom is a Document Object Model specifically applicable to HTML/XHTML. Software developers can understand html dom as a web page API. It regards each element in the webpage as an object, so that the elements in the webpage can be obtained or edited by computer language. For example, Javascript can use html dom to dynamically modify webpages.

The use of JavaScript can easily control the addition, deletion, modification, and query of webpage nodes for these DOM nodes.

II. basic objectives

Use JavaScript to add, delete, modify, and query webpage nodes. In a webpage, the following are available:

1. add node. this button adds the node option in the drop-down menu associated with the replace button while adding nodes. If there are nine nodes in the webpage, do not add and pop-up warnings.

2. click the delete last node button. this button reduces the node options in the drop-down menu associated with the replace button while reducing nodes.

3. click "replace node content". First, select the node to be operated and enter the content to replace. then, the corresponding node is replaced.

4. if the webpage does not contain any node, delete or replace the node without warning.

III. Production process

You do not need to configure any environment and directly write the following code on the webpage. the specific code is as follows:





Jspnode

The code is as follows:

And other html tags, rather than simplyLabel) is an element node. 3. text contained in HTML elements is a text node. 4. Each HTML attribute is an attribute node.For example, you can draw a page into the following DOM node tree:
Related Article

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.