cari

Rumah  >  Artikel  >  hujung hadapan web  >  简述jquery中next、nextAll、nextUntil、siblings之间的区别与联系

简述jquery中next、nextAll、nextUntil、siblings之间的区别与联系

巴扎黑
巴扎黑asal
2017-06-22 14:07:181582semak imbas

在本文为大家详细介绍下jquery next nextAll nextUntil siblings的区别，感兴趣的朋友可以参考下

next：紧挨着$('')的一个元素

nextAll：在$('')以后的所有的同辈元素

nextUntil：until有直到。。。之前的意思，所以他表示$('')以后的所有的同辈元素，不过要在nextUntil参数之前，不包括匹配的元素本身

sibings:$('')前后的所有同辈元素

简单理解就是，next就是找他的弟弟/妹妹，nextAll就是找他所有的弟弟/妹妹，nextUntil就是找比他小一定年龄的弟弟/妹妹，siblings就是找他所有的哥哥/姐姐，还有他的所有的弟弟/妹妹。所以同理的同辈关系，prev，prevAll ，prevUntil

下面是简单的测试代码

代码如下:

<!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>


Atas ialah kandungan terperinci 简述jquery中next、nextAll、nextUntil、siblings之间的区别与联系. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan：
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel sebelumnya：有关jQuery中parent()和siblings()的简单问题详解Artikel seterusnya：有关jquery中的遍历函数siblings()其用法详解

Artikel berkaitan

Lihat lagi