Briefly describe the differences and connections between next, nextAll, nextUntil, and siblings in jquery-JS Tutorial-php.cn

Briefly describe the differences and connections between next, nextAll, nextUntil, and siblings in jquery

巴扎黑

Release： 2017-06-22 14:07:18

Original

1596 people have browsed it

In this article, I will introduce the difference between siblings in detailjquery next nextAll nextUntil siblings. Interested friends can refer to

next: an element next to $('')

nextAll: All sibling elements after $('')

nextUntil: until. . . It means before, so it means all sibling elements after $(''), but before the nextUntil parameter, excluding the matching element itself

sibings: All sibling elements before and after $('')

The simple understanding is that next is to find his younger brother/sister, nextAll is to find all his younger brothers/sisters, nextUntil is to find younger brothers/sisters who are a certain age younger than him, siblings is to find all his brothers/ Sister, and all his brothers/sisters. So the same peer relationship, prev, prevAll, prevUntil

The following is a simple test code

The code is as follows:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> 
<head> 
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"> 
<title>
Document
</title> 
<script type=&#39;text/
javascript
&#39; src=&#39;http://code.jquery.com/jquery-1.9.1.min.js&#39;></script> 
</head> 
<body> 
<p class="first"> 
<a href="#">hhh</a> 
<h1>这是一个标题</h1> 
<p>这是一个test</p> 
<p>这是一个test</p> 
<p>这是一个test</p> 
<p>这是一个test</p> 
<p>hhha</p> 
<p>这是一个test</p> 
<p>这是一个test</p> 
</p> 
<script> 
$(function(){ 
//$(&#39;p
:first
&#39;).next().css(&#39;
background
&#39;,&#39;red&#39;); 
//$(&#39;p:first&#39;).nextAll().css(&#39;background&#39;,&#39;yellow&#39;); 
//$(&#39;p:first&#39;).nextUntil(&#39;p&#39;).css({&#39;
font-size
&#39;:20,background:&#39;red&#39;}); 
//$(&#39;p:first&#39;).siblings().css(&#39;background&#39;,&#39;yellow&#39;); 
}); 
</script> 
</body> 
</html>

Copy after login

The above is the detailed content of Briefly describe the differences and connections between next, nextAll, nextUntil, and siblings in jquery. For more information, please follow other related articles on the PHP Chinese website!