用jquery怎么取父节点的兄弟节点

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()，parents，closest()，这些都可以查找父元素或节点，具体步骤如下：

一parent([expr])

用一个包含着所有匹配元素的唯一父元素的元素集合。

你用可选的表达式来筛选。

如下：

1$('#item1')parent()parent；

二parent

得到含有子元素或者文本的元素

如下：

1$('li:parent');

2parents([expr])

得到一个包含着所有匹配元素的祖先元素的元素集合。可以通过一个可选的表达式进行筛选。

如下：

1$('#items')parents('parent1');

三closest([expr])

closest会首先检查当前元素是否匹配，如果匹配则直接返回元素本身。如果不匹配则向上查找父元素，一层一层往上，直到找到匹配选择器的元素。如果什么都没找到则返回一个空的jQuery对象。

需要准备的材料分别有：电脑、html编辑器、浏览器。

1、首先，打开html编辑器，新建html文件，例如：indexhtml，并引入jquery。

2、在indexhtml中的<script>标签，输入jquery代码：

$('body')append($('#c')parent()prev()attr('id'));

3、浏览器运行indexhtml页面，此时成功获取了id为c的元素的父元素的上一个元素的id并打印了出来。

给你写个简单的 demo

<div class="boxbox clearfix">

    <span class="selected" id="boxboxa">a</span>

    <span id="boxboxb">b</span>

</div>

<div class="boxbox-con">

    <div class="onediv" id="onediv">一个div</div>

    <div class="otherdiv" id="otherdiv">另一个div</div>

</div><style type="text/css">

    clearfix:before,clearfix:after {display: table; content: ''; height: 0; width: 0; clear: both;}

    boxbox span {width: 200px; float: left; display: inline-block; height: 35px; line-height: 35px; text-align: center; font-size: 24px}

    boxbox spanselected {background-color: #f1f1f1;}

    boxbox-con {height: 300px;}

    boxbox-con onediv {background-color: red; height: 100%;}

    boxbox-con otherdiv {background-color: cyan; display: none; height: 100%}

</style><script type="text/javascript" src="jqueryjs"></script>

<script type="text/javascript">

    $('#boxboxa')on('click',function(){

        $(this)addClass('selected')siblings()removeClass('selected');

        $('#onediv')show();

        $('#otherdiv')hide();

    });

    $('#boxboxb')on('click',function(){

        $(this)addClass('selected')siblings()removeClass('selected');

        $('#onediv')hide();

        $('#otherdiv')show();

    });

</script>

//获取选中行的ID

function getSelectRowFindID(obj)

{

//this就是触发动作的元素本身，触发函数时传this，getSelectRowFindID(this)

//向上一级parent()是td，再向上parent()是tr ，找到tr的隐藏域或者是单元格绑定的ID

var ID= $(obj)parent()parent()find("input:hidden")val();//隐藏域

ID=$(obj)parent()parent()children()eq(0)text();//单元格：tr的子元素children()的第一个tdeq(0)的文本值。

}

这些jquery的一些查找方法：可以看看

jQueryparent(expr)           //找父元素

jQueryparents(expr)          //找到所有祖先元素，不限于父元素

jQuerychildren(expr)        //查找所有子元素，只会找到直接的孩子节点，不会返回所有子孙

jQuerycontents()            //查找下面的所有内容，包括节点和文本。

jQueryprev()                //查找上一个兄弟节点，不是所有的兄弟节点

jQueryprevAll()             //查找所有之前的兄弟节点

jQuerynext()                //查找下一个兄弟节点，不是所有的兄弟节点

jQuerynextAll()             //查找所有之后的兄弟节点

jQuerysiblings()            //查找兄弟节点，不分前后

jQueryfind(expr)            //跟jQueryfilter(expr)完全不一样，jQueryfilter(expr)是从初始的

jQuery对象集合中筛选出一部分，而jQueryfind()的返回结果，不会有初始集中

筛选出一部分，而jQueryfind()的返回结果，不会有初始集合中的内容，比如：

  $("p")find("span")是从元素开始找，等于$("p span")

以上就是关于用jquery怎么取父节点的兄弟节点全部的内容，包括:用jquery怎么取父节点的兄弟节点、如何在jQuery查找元素父节点、jquery怎么获取父元素上一个元素的id等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！