JQuery Method for deleting DOM nodes _ jquery

Source: Internet
Author: User
This article mainly introduces JQuery's method for deleting DOM nodes. The example analyzes jQuery's techniques for deleting nodes using the remove and empty methods, for more information about how to delete DOM nodes, see the example in this article. Share it with you for your reference. The specific analysis is as follows:

If an element in the document is redundant, delete it. JQuery provides two methods to delete nodes: remove () and empty ().

The html dom structure is as follows:

Welcome to my home

  • Simple PHP programming
  • Easy-to-understand C Programming
  • Simple and easy-to-understand JavaScript programming
  • Simple and easy-to-understand JQuery Programming

Remove () method

The function is to delete all matching elements from the DOM. The input parameters are used to filter elements based on JQuery expressions.

For example, delete

    2nd of nodes
  • Element Node. The JQuery code is as follows:

    $ (". Nm_ul li: eq (1)"). remove (); // obtain the second
  • After the element node is deleted from the webpage
  • After the code is run, the second node is deleted.

    When a node is deleted using the remove () method, all child nodes contained in the node will be deleted at the same time. The return value of this method is a reference pointing to the deleted node. Therefore, these elements can be used later. The following JQuery Code indicates that the elements can still be used after being deleted using the remove () method.

    Var $ li = $ ("nm_ul li: eq (1)"). remove (); // obtain the second
  • After the element node is deleted from the webpage. $ Li. appendTo ("nm_ul"); // Add the deleted one
      Element. Therefore, the deletion is only deleted from the webpage. In the jQuery object, this element still exists and we can retrieve it again.
  • You can directly use the features of the appendTo () method to simplify the above Code. The JQuery code is as follows:

    $ ("Nm_ul li: eq (1 )"). appendTo ("nm_ul"); // The appendTo () method can also be used to delete an element from the document when moving an element, insert this element to the specified node in the document.

    In addition, the remove () method can also selectively Delete elements by passing parameters. The JQuery code is as follows:

    // Set
  • The attribute title in the element is not equal to the "pineapple"
  • Element deletion $ ("nm_ul li"). remove ("li [title! = JQuery] ");
  • Empty () method

    Strictly speaking, the empty () method does not delete nodes, but clears nodes. It can clear all child nodes in the element. The JQuery code is as follows:

    $ ("Nm_ul li: eq (1)"). empty (); // find the second
  • After the element node, clear the content of this element.
  • When the code is run, 2nd

  • The content of the element is cleared, leaving only
  • The default label symbol ".".

    I hope this article will help you with jQuery programming.

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.