jquery cultivation experience-dom Node deletion

Source: Internet
Author: User
Tags comparison table
<span id="Label3"></p><p><p>To remove nodes on a page is a common practice for developers, jquery offers several different ways to deal with this Problem.</p></p><strong><strong>1.empty</strong></strong><p align="left"><p align="left">empty, as the name implies, clears the method, but is a little different from the deletion, because it only removes all child nodes in the specified Element.</p></p><p align="left"><p align="left">This method not only removes the child elements (and other descendant elements), but also removes the text from the Element. because, according to the instructions, any text string in the element is considered to be a child of that Element. If we remove all the elements of the div in the empty method, it simply empties the internal HTML code, but the markup remains in the dom, with empty removing all the P elements under the current DIV element but the id=test div element itself is not Deleted.</p></p><pre><pre><span style="color: #0000ff;">function</span> <span style="color: #000000;">() { </span><span style="color: #008000;">//</span> <span style="color: #008000;">Remove all p elements under the current DIV element by empty</span> <span style="color: #008000;">//</span> <span style="color: #008000;">but the DIV element itself id=test is not deleted</span> $ ("#test"<span style="color: #000000;">). empty ()})</span></pre></pre><strong><strong>2.remove</strong></strong><p><p>remove, like empty, is the method of removing elements, But remove removes the element itself and removes everything inside the element, including the bound event and the jquery data associated with the Element.</p></p><p><p>For example, a node, binding a fixed-point event, if not removed by removing the node is actually very simple, but also need to destroy the event, here is to prevent "memory leaks", so the front-end developers must pay attention to how many events tied, do not have to remember when the Destruction. Removing the DIV and all its internal elements through the Remove method automatically actions the event destruction method, so it is very easy to use.</p></p><p><p>Remove Expression Parameter:</p></p><p><p>Remove is a good place to pass a selector expression to filter the set of matching elements that will be removed, optionally delete the specified node, we can select a group of identical elements through $ () and then pass the filtered rule through remove (), such as $ ("p"). Filter (": contains (' 3 ')"). remove ().</p></p><pre><body> <style><span style="color: #000000;"><span style="color: #000000;">. Test1 {background: #bbffaa; }. test2 {background:yellow; } </span></span></style>

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.