Home>Article>Web Front-end> How to remove and add elements in javascript

How to remove and add elements in javascript

青灯夜游
青灯夜游 Original
2021-07-16 11:05:22 4636browse

In JavaScript, you can use the "parent element object.appendChild(new element)" or "parent element object.insertBefore(new element, insertion point)" statement to add a new element to the parent element; you can use " Parent element object.removeChild(child element)" statement deletes child elements.

How to remove and add elements in javascript

The operating environment of this tutorial: windows7 system, javascript version 1.8.5, Dell G3 computer.

javascript to delete and add elements

1. Add elements

    javascript添加元素  

段落一

段落二

在末尾插入新节点 在开头插入新节点

Rendering:

How to remove and add elements in javascript

Description: The

appendChild() method adds a new child node to the end of the current node's child node list. The usage is as follows:

appendChild(newchild)
  • The parameter newchild represents the newly added node object and returns the newly added node.

The insertBefore() method adds a new child node to the beginning of the current node's child node list. The usage is as follows:

insertBefore(newchild, refchild)
  • The parameter newchild represents the newly inserted node, and refchild represents the node where the new node is inserted, which is used to specify the adjacent position behind the inserted node.

  • After the insertion is successful, this method will return the newly inserted child node.

document.createElement() creates an element node call.

2. Delete elements

    javascript删除元素  

段落一

段落二

删除节点

Rendering:

How to remove and add elements in javascript

Description:

removeChild() method can delete a child node on the parent node.

Syntax:

parentNode.removeChild(nodeName)
  • nodeName: The name of the current node

  • parentNode: The parent node of the current node

[Recommended learning:javascript advanced tutorial]

The above is the detailed content of How to remove and add elements in javascript. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn