Network Security Internet Technology Development Database Servers Mobile Phone Android Software Apple Software Computer Software News IT Information

In addition to Weibo, there is also WeChat

Please pay attention

WeChat public account

Shulou

How jquery removes sibling nodes

2025-01-19 Update From: SLTechnology News&Howtos shulou NAV: SLTechnology News&Howtos > Development >

Share

Shulou(Shulou.com)05/31 Report--

This article mainly introduces "how jquery removes sibling nodes". In daily operation, I believe many people have doubts about how jquery removes sibling nodes. Xiaobian consulted all kinds of materials and sorted out simple and easy-to-use operation methods. I hope it will be helpful for you to answer the doubts of "how to remove sibling nodes by jquery"! Next, please follow the editor to study!

Jquery remove sibling node method: 1, use siblings (), next (), prev () and other functions to get the designated siblings of the selected element, such as "element object .siblings ()"; 2, use remove () to delete the acquired siblings, syntax "siblings ()".

The operating environment of this tutorial: windows7 system, jquery1.10.2 version, Dell G3 computer.

The method of removing sibling nodes by jquery

Realize the idea:

Obtaining sibling nodes by jquery method

There are generally seven methods to get sibling nodes: siblings (), next (), nextAll (), nextUntil (), prev (), prevAll (), prevUntil ()

The siblings () method, which is mainly used to get all sibling elements of the specified element

The next () method, which is mainly used to get the next sibling element of the specified element

The nextAll () method is mainly used to get all sibling elements of the next sibling of the specified element

The nextUntil () method is mainly used to get the next sibling element of the specified element, which must be the element between the specified element and the element set by the nextUntil () method

The prev () method, which is mainly used to get the sibling element at the next level of the specified element

The prevAll () method, which is mainly used to get all sibling elements one level above the specified element

The prevUntil () method is mainly used to get the previous sibling element of the specified element, which must be the element between the specified element and the element set by the prevUntil () method

Delete the acquired sibling node using the remove () method

Let's take siblings (), next (), prev () as examples to introduce the deletion method:

Example 1: remove the sibling node obtained by the siblings () method

.siblings * {display: block; border: 2px solid lightgrey; color: lightgrey; padding: 5px; margin: 15px } $(document) .ready (function () {$("li.start"). Siblings (). Css ({"color": "red") "border": "2px solid red"}) $("button") .click (function () {$("li.start"). Siblings (). Remove ();}) Ul (parent) li (last sibling node of the class named "star") li (last sibling node of the class name "star") Li element li with class name "star" (next sibling node with class name "star") li (next sibling node with class name "star")

Select all sibling elements of the li element with the class name "star"

Delete all sibling elements

Example 2: remove the sibling node obtained by the next () method

.siblings * {display: block; border: 2px solid lightgrey; color: lightgrey; padding: 5px; margin: 15px } $(document) .ready (function () {$("li.start"). Next (). Css ({"color": "red") "border": "2px solid red"}) $("button") .click (function () {$("li.start"). Next (). Remove ();}) Ul (parent node) li (previous sibling node of class named "star") li (last sibling node of class name "star") Li element li with class name "star" (next sibling node with class name "star") li (next sibling node with class name "star")

Select the next sibling element of the li element with the class name "star"

Delete the next sibling element

Example 3: remove the sibling node obtained by the prev () method

.siblings * {display: block; border: 2px solid lightgrey; color: lightgrey; padding: 5px; margin: 15px } $(document) .ready (function () {$("li.start"). Prev (). Css ({"color": "red") "border": "2px solid red"}) $("button") .click (function () {$("li.start"). Prev (). Remove ();}) Ul (parent node) li (previous sibling node of class named "star") li (last sibling node of class name "star") Li element li with class name "star" (next sibling node with class name "star") li (next sibling node with class name "star")

Select the previous sibling element of the li element with the class name "star"

Delete the previous sibling element

At this point, the study on "how to remove sibling nodes from jquery" is over. I hope to be able to solve your doubts. The collocation of theory and practice can better help you learn, go and try it! If you want to continue to learn more related knowledge, please continue to follow the website, the editor will continue to work hard to bring you more practical articles!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.

Views: 299

*The comments in the above article only represent the author's personal views and do not represent the views and positions of this website. If you have more insights, please feel free to contribute and share.

Share To

Development

Wechat

© 2024 shulou.com SLNews company. All rights reserved.

12
Report