How to clear child elements in jquery

Jquery method of clearing child elements: 1. Use the children() method to obtain all child element objects under the parent element. The syntax is "parent element object.children()"; 2. Use the remove() method to The obtained child element object can be cleared, and the syntax is "child element object.remove()".

The operating environment of this tutorial: windows7 system, jquery3.2.1 version, Dell G3 computer.

How jquery clears child elements

In jquery, by obtaining the element object, use the children() method to obtain its child elements, use The remove() method can be used to delete child elements.

The example is as follows:

1. Create a new html file, named test.html, to explain how jquery deletes child elements. Use the div tag to create a module, and within the div, use the p tag to create a line of text.

In order to show the effect, in the test.html file, use css to set the style of the div, define the width of the div as 200px, the height as 30px, the line height as 30px, and the background color as red. At the same time, define the p tag The text is white.

Create a button with the button tag, and the button name is "Delete the child elements of the div". Bind the onclick click event to the button button. When the button is clicked, the myfun() function is executed.

2. In the js tag, create the myfun() function. Within the function, obtain the div object through the element name, and use the children() method to obtain the child elements of the div. , delete all child elements under the div through the remove() method.

Open the test.html file in the browser and click the button to see the effect.

After clicking the button:

Summary:

1. Create a test.html file .

2. In the file, use the div tag to create a module, and in the div, use the p tag to create a line of text. At the same time, create a button button to trigger the execution of the js function.

3. Create a function in the js tag. In the function, obtain the div object through the element name. Use the children() method to obtain the child elements of the div. Use the remove() method to remove all the children under the div. Element removed.

Note:

The children() method gets all the child elements under the element object.

Recommended related video tutorials: jQuery video tutorial

The above is the detailed content of How to clear child elements in jquery. For more information, please follow other related articles on the PHP Chinese website!