jquery查找兄弟节点,jq 获取兄弟节点
JQuery有几种选择器?
$("#myELement")??选择id值等于myElement的元素，id值不能重复在文档中只能有一个id值是myElement所以得到的是唯一的元素
$("div")?????选择所有的div标签元素，返回div元素数组
$(".myClass")???选择使用myClass类的css的所有元素
$("*")??????选择文档中的所有的元素，可以运用多种的选择方式进行联合选择：例如$("#myELement,div,.myclass")
层叠选择器：
$("forminput")????选择所有的form元素中的input元素
$("#main*")?????选择id值为main的所有的子元素
$("label+input")??选择所有的label元素的下一个input元素节点，经测试选择器返回的是label标签后面直接跟一个input标签的所有input标签元素
$("#prev~div")???同胞选择器，该选择器返回的为id为prev的标签元素的所有的属于同一个父元素的div标签
基本过滤选择器：
$("tr:first")???????选择所有tr元素的第一个
$("tr:last")????????选择所有tr元素的最后一个
$("input:not(:checked)+span")
过滤掉：checked的选择器的所有的input元素
$("tr:even")???????选择所有的tr元素的第0，2，4......个元素（注意：因为所选择的多个元素时为数组，所以序号是从0开始）
$("tr:odd")????????选择所有的tr元素的第1，3，5......个元素
$("td:eq(2)")??????选择所有的td元素中序号为2的那个td元素
$("td:gt(4)")??????选择td元素中序号大于4的所有td元素
$("td:ll(4)")???????选择td元素中序号小于4的所有的td元素
$(":header"
内容过滤选择器：
$("div:contains('John')")选择所有div中含有John文本的元素
$("td:empty")?????选择所有的为空（也不包括文本节点）的td元素的数组
$("div:has(p)")????选择所有含有p标签的div元素
$("td:parent")?????选择所有的以td为父节点的元素数组
可视化过滤选择器：
$("div:hidden")????选择所有的被hidden的div元素
$("div:visible")????选择所有的可视化的div元素
属性过滤选择器：
$("div[id]")???????选择所有含有id属性的div元素
$("input[name='newsletter']")??选择所有的name属性等于'newsletter'的input元素
$("input[name!='newsletter']")选择所有的name属性不等于'newsletter'的input元素
$("input[name^='news']")????选择所有的name属性以'news'开头的input元素
$("input[name$='news']")????选择所有的name属性以'news'结尾的input元素
$("input[name*='man']")?????选择所有的name属性包含'news'的input元素
$("input[id][name$='man']")??可以使用多个属性进行联合选择，该选择器是得到所有的含有id属性并且那么属性以man结尾的元素
子元素过滤选择器：
$("ulli:nth-child(2)"),$("ulli:nth-child(odd)"),$("ulli:nth-child(3n+1)")
$("divspan:first-child")?????返回所有的div元素的第一个子节点的数组
$("divspan:last-child")?????返回所有的div元素的最后一个节点的数组
$("divbutton:only-child")???返回所有的div中只有唯一一个子节点的所有子节点的数组
表单元素选择器：
$(":input")?????????选择所有的表单输入元素，包括input,textarea,select和button
$(":text")??????????选择所有的textinput元素
$(":password")?????选择所有的passwordinput元素
$(":radio")?????????选择所有的radioinput元素
$(":checkbox")??????选择所有的checkboxinput元素
$(":submit")???????选择所有的submitinput元素
$(":image")????????选择所有的imageinput元素
$(":reset")?????????选择所有的resetinput元素
$(":button")????????选择所有的buttoninput元素
$(":file")??????????选择所有的fileinput元素
$(":hidden")???????选择所有类型为hidden的input元素或表单的隐藏域
表单元素过滤选择器：
$(":enabled")??????选择所有的可操作的表单元素
$(":disabled")??????选择所有的不可操作的表单元素
$(":checked")??????选择所有的被checked的表单元素
$("selectoption:selected")选择所有的select的子元素中被selected的元素
选取一个name为”S_03_22″的inputtext框的上一个td的text值
$(”input[@name=S_03_22]“).parent().prev().text()
名字以”S_”开始，并且不是以”_R”结尾的
$(”input[@name^='S_']“).not(”[@name$='_R']“)
一个名为radio_01的radio所选的值
$(”input[@name=radio_01][@checked]“).val();
$("AB")查找A元素下面的所有子节点，包括非直接子节点
$("AB")查找A元素下面的直接子节点
$("A+B")查找A元素后面的兄弟节点，包括非直接子节点
$("A~B")查找A元素后面的兄弟节点，不包括非直接子节点
jq中获取兄弟节点的方法
('#id').prev() 当前元素前一个兄弟节点
('#id').next() 当前元素之后第一个兄弟节点
$('#id').nextAll() 当前元素之后所有的兄弟节点
参考文档：
浅析jQuery中常用的元素查找方法总结
本篇文章是对jQuery中常用的元素查找方法进行了详细的总结和介绍 需要的朋友参考下 ?
$("#myELement") 选择id值等于myElement的元素 id值不能重复在文档中只能有一个id值是myElement所以得到的是唯一的元素 $("div") 选择所有的div标签元素 返回div元素数组 $(" myClass")?? 选择使用myClass类的css的所有元素 $("*") 选择文档中的所有的元素 可以运用多种的选择方式进行联合选择 例如$("#myELement div myclass")
层叠选择器 $("form input") 选择所有的form元素中的input元素 $("#main *")? 选择id值为main的所有的子元素 $("label + input") 选择所有的label元素的下一个input元素节点 经测试选择器返回的是label标签后面直接跟一个input标签的所有input标签元素 $("#prev ~ div") 同胞选择器 该选择器返回的为id为prev的标签元素的所有的属于同一个父元素的div标签
基本过滤选择器 $("tr:first") 选择所有tr元素的第一个 $("tr:last")? 选择所有tr元素的最后一个 $("input:not(:checked) + span")
过滤掉 checked的选择器的所有的input元素 $("tr:even")?? 选择所有的tr元素的第 个元素（注意 因为所选择的多个元素时为数组 所以序号是从 开始） $("tr:odd")??? 选择所有的tr元素的第 个元素 $("td:eq( )")? 选择所有的td元素中序号为 的那个td元素 $("td:gt( )")? 选择td元素中序号大于 的所有td元素 $("td:ll( )")? 选择td元素中序号小于 的所有的td元素 $(":header") $("div:animated")
内容过滤选择器 $("div:contains( John )") 选择所有div中含有John文本的元素 $("td:empty")???????????? 选择所有的为空（也不包括文本节点）的td元素的数组 $("div:has(p)")?????????? 选择所有含有p标签的div元素 $("td:parent")??????????? 选择所有的以td为父节点的元素数组
可视化过滤选择器 $("div:hidden")?????????? 选择所有的被hidden的div元素 $("div:visible")????????? 选择所有的可视化的div元素
属性过滤选择器 $("div[id]")????????????? 选择所有含有id属性的div元素 $("input[name= newsletter ]")??? 选择所有的name属性等于 newsletter 的input元素 $("input[name!= newsletter ]")?? 选择所有的name属性不等于 newsletter 的input元素 $("input[name^= news ]")???????? 选择所有的name属性以 news 开头的input元素 $("input[name$= news ]")???????? 选择所有的name属性以 news 结尾的input元素 $("input[name*= man ]")????????? 选择所有的name属性包含 news 的input元素 $("input[id][name$= man ]")??? 可以使用多个属性进行联合选择 该选择器是得到所有的含有id属性并且那么属性以man结尾的元素
子元素过滤选择器 $("ul li:nth child( )") $("ul li:nth child(odd)") $("ul li:nth child( n + )") $("div span:first child")?? 返回所有的div元素的第一个子节点的数组 $("div span:last child")??? 返回所有的div元素的最后一个节点的数组 $("div button:only child")? 返回所有的div中只有唯一一个子节点的所有子节点的数组
表单元素选择器 $(":input")?????? 选择所有的表单输入元素 包括input textarea select 和 button $(":text")??????? 选择所有的text input元素 $(":password")??? 选择所有的password input元素 $(":radio")?????? 选择所有的radio input元素 $(":checkbox")??? 选择所有的checkbox input元素 $(":submit")????? 选择所有的submit input元素 $(":image")?????? 选择所有的image input元素 $(":reset")?????? 选择所有的reset input元素 $(":button")????? 选择所有的button input元素 $(":file")??????? 选择所有的file input元素 $(":hidden")????? 选择所有类型为hidden的input元素或表单的隐藏域
表单元素过滤选择器 $(":enabled")?? 选择所有的可操作的表单元素 $(":disabled")? 选择所有的不可操作的表单元素 $(":checked")?? 选择所有的被checked的表单元素 $("select option:selected") 选择所有的select 的子元素中被selected的元素 选取一个name 为”S_ _ ″的input text框的上一个td的text值 $(”input[@name =S_ _ ]“) parent() prev() text() 名字以”S_”开始 并且不是以”_R”结尾的 $(”input[@name ^= S_ ]“) not(”[@name $= _R ]“) 一个名为radio_ 的radio所选的值 $(”input[@name =radio_ ][@checked]“) val(); $("A B") 查找A元素下面的所有子节点 包括非直接子节点 $("AB") 查找A元素下面的直接子节点 $("A+B") 查找A元素后面的兄弟节点 包括非直接子节点 $("A~B") 查找A元素后面的兄弟节点 不包括非直接子节点
$("A B") 查找A元素下面的所有子节点 包括非直接子节点 例子 找到表单中所有的 input 元素 HTML 代码: form labelName:/label input name=name / fieldset ????? labelNewsletter:/label ????? input name=newsletter / /fieldset /form input name=none / jQuery 代码: $("form input") 结果: [ input name=name / input name=newsletter / ]
$("AB") 查找A元素下面的直接子节点 例子 匹配表单中所有的子级input元素 HTML 代码: form labelName:/label input name=name / fieldset ????? labelNewsletter:/label ????? input name=newsletter / /fieldset /form input name=none / jQuery 代码: $("form input") 结果: [ input name=name / ]
$("A+B") 查找A元素后面的兄弟节点 包括非直接子节点 例子 匹配所有跟在 label 后面的 input 元素 HTML 代码: form labelName:/label input name=name / fieldset ????? labelNewsletter:/label ????? input name=newsletter / /fieldset /form input name=none / jQuery 代码: $("label + input") 结果: [ input name=name / input name=newsletter / ]
lishixinzhi/Article/program/Java/JSP/201311/20132
用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'?只匹配一个元素，而此选择符将为每个父元素匹配一个子元素