可以使用jQuery的children方法来获取某个元素下的所有子元素。如果给定表示 DOM 元素集合的 jQuery 对象，children() 方法允许我们检索 DOM 树中的这些元素，并用匹配元素构造新的 jQuery 对象。find() 和 children() 方法类似，不过后者只沿着 DOM 树向下遍历单一层级。
工具原料：编辑器、浏览器
1、使用children方法可以获得选择器下的所有子元素，代码实例如下：
<!DOCTYPE html><html>
<head>
<script type="text/javascript" src="/jquery/jqueryjs"></script>
<style>
body { font-size:16px; font-weight:bolder; }
p { margin:5px 0; }
</style>
</head>
<body>
<div>
<span>Hello</span>
<p class="selected">Hello Again</p>
<div class="selected">And Again</div>
<p>And One Last Time</p>
</div>
<script>$("div")children("selected")css("color", "blue");</script>
</body>
</html>
2、运行的结果是找到类名为 "selected" 的所有 div 的子元素，并将其设置为蓝色，结果如下：
jquery获取父元素方法比较多，比如parent()，parents()，closest()，find,first-child这些都能帮你实现查找父节点、子节点、兄弟节点。
$('#cur')parent()parent();或$('#cur')parent()parent('pp');或$('#cur')parent('pp');
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
匹配第一个子元素
':first' 只匹配一个元素，而此选择符将为每个父元素匹配一个子元素
jQuery 提供了 parent() 方法用以获取当前匹配元素集合中每个元素的父元素，例如：
$("span")parent(); // 获取所有span标签元素的父节点对象集合
$("selected")parent(); // 获取所有class位selected的元素的父节点对象集合
$(spanselected)parent(); // 获取class为selected的span标签元素的父节点对象集合
另外，注意与parents() 方法的区别——parents() 方法获取当前匹配元素集合中每个元素的祖先元素（祖先元素不仅包括父节点，还包括祖父、曾祖父等等）。
jquery中parent()可以获取父级元素，所以获得某元素父级的父级可以使用
$(selector)parent()parent();
示例如下
创建Html代码及css样式
<div class="class1">
class1
<div class="class2">
class2
<div class="class3">
class3
</div>
</div>
</div>
div{padding:10px 20px;border:4px solid #ebcbbe;}
divclass1{width:200px;height:120px;}
编写jquery代码
$(function(){
$("divclass3")click(function() {
obj = $(this)parent()parent();
alert(objprop('class'));
});
})
以上就是关于jquery如何获取父元素的子元素全部的内容，包括:jquery如何获取父元素的子元素、用jquery怎么取父节点的兄弟节点的所有子节点、jquery 如何得到父节点对象等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）