jquery获取父节点、子节点、兄弟节点方法（转）

jquery获取父元素方法比较多，比如parent()，parents()，closest()，find,first-child这些都能帮你实现查找父节点、子节点、兄弟节点。

如我们利用parent()来获取父节点

$('#cur').parent().parent();
或
$('#cur').parent().parent('.pp');
或
$('#cur').parent('.pp');

function showInfo(id){
alert(id);
// alert(document.getElementById(id).parentNode.id);
var obj = $('#'+id).closest('.parent1');
alert(obj[0].id);
}

closest和parents的主要区别是：

前者从当前元素开始匹配寻找，后者从父元素开始匹配寻找 
前者逐级向上查找，直到发现匹配的元素后 就停止了，后者一直向上查找直到根元素，然后把这些元素放进一个临时集合中，再用给定的选择器表达式去过滤 
前者返回0或1个元素，后者可能包含0 个，1个，或者多个元素

jquery 兄弟节点的获取

<ul> 
<li> 
<h3 class="title">类目一</h3> 
<ul> 
<li>第一项</li> 
<li>第二项</li> 
</ul> 
</li> 
<li> 
<h3 class="title">类目二</h3> 
<ul> 
<li>第一项</li> 
<li>第二项</li> 
</ul> 
</li>
</ul>

比如要点击类目一所在的 h3，对其兄弟节点的 ul 添加一个叫做 "show" 的 class，代码如下：

$(".title").click(function () { $(this).parent().find('ul').addClass('show'); });

就是通过先找到 h3 与 ul 共同的父节点 li 然后来用 find() 找到 ul，还有一种方法是使用 siblings() 函数，代码如下:

(".title").click(function() { $(this).siblings('ul').addClass('show'); })

子节点怎么获得 .

$("#tbody1:first-child")
:first-child

除非特别声明，PHP100新闻均为原创或投稿报道，转载请注明作者及原文链接
原文地址： http://www.php100.com/html/program/jquery/2013/0905/5913.html

 

转载于:https://www.cnblogs.com/ganymede/p/3802568.html