用jquery怎么取父節(jié)點(diǎn)的兄弟節(jié)點(diǎn)的所有子節(jié)點(diǎn)

jquery獲取父元素方法比較多，比如parent()，parents()，closest()，find,first-child這些都能幫你實(shí)現(xiàn)查找父節(jié)點(diǎn)、子節(jié)點(diǎn)、兄弟節(jié)點(diǎn)。

為萬(wàn)全等地區(qū)用戶(hù)提供了全套網(wǎng)頁(yè)設(shè)計(jì)制作服務(wù)，及萬(wàn)全網(wǎng)站建設(shè)行業(yè)解決方案。主營(yíng)業(yè)務(wù)為成都網(wǎng)站制作、成都做網(wǎng)站、外貿(mào)營(yíng)銷(xiāo)網(wǎng)站建設(shè)、萬(wàn)全網(wǎng)站設(shè)計(jì)，以傳統(tǒng)方式定制建設(shè)網(wǎng)站，并提供域名空間備案等一條龍服務(wù)，秉承以專(zhuān)業(yè)、用心的態(tài)度為用戶(hù)提供真誠(chéng)的服務(wù)。我們深信只要達(dá)到每一位用戶(hù)的要求，就會(huì)得到認(rèn)可，從而選擇與我們長(zhǎng)期合作。這樣，我們也可以走得更遠(yuǎn)！

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

jquery 兄弟節(jié)點(diǎn)的獲取

ul

li

h3 class="title"類(lèi)目一/h3

ul

li第一項(xiàng)/li

li第二項(xiàng)/li

/ul

/li

li

h3 class="title"類(lèi)目二/h3

ul

li第一項(xiàng)/li

li第二項(xiàng)/li

/ul

/li/ul

比如要點(diǎn)擊類(lèi)目一所在的 h3，對(duì)其兄弟節(jié)點(diǎn)的 ul 添加一個(gè)叫做 "show" 的 class，代碼如下：

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

就是通過(guò)先找到 h3 與 ul 共同的父節(jié)點(diǎn) li 然后來(lái)用 find() 找到 ul，還有一種方法是使用 siblings() 函數(shù)，代碼如下:

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

子節(jié)點(diǎn)怎么獲得 .

$("#tbody1:first-child")

:first-child

匹配第一個(gè)子元素

':first' 只匹配一個(gè)元素，而此選擇符將為每個(gè)父元素匹配一個(gè)子元素

jquery如何獲取第一個(gè)或最后一個(gè)子節(jié)點(diǎn)

獲取一組節(jié)點(diǎn)以后，就得到一個(gè)數(shù)組，根據(jù)數(shù)組下標(biāo)能獲取第一個(gè)或最后一個(gè)子節(jié)點(diǎn)

如何用jquery選擇父節(jié)點(diǎn)下的第一代子節(jié)點(diǎn)

ul?id="wrap"

li?class="li1"1

ul

li?class="li1.1"1.1/li

li?class="li1.2"1.2/li

/ul

/li

li?class="li2"2

ul

li?class="li2.1"2.1/li

li?class="li2.2"2.2/li

/ul

/li

/ul

script?src="jquery-3.1.1.js"/script

script

//wrap下所有的的li標(biāo)簽

$("#wrap").find("li").each(function?()?{

console.log("Find:?"+$(this).attr("class"))

});

//wrap下子標(biāo)簽

$("#wrap").children("li").each(function(){

console.log("Children:?"+$(this).attr("class"))

});

/script

jquery 取ul的第一個(gè)子節(jié)點(diǎn)，追加到ul的末尾，為什么ul的子節(jié)點(diǎn)個(gè)數(shù)不增加？

你選取了某個(gè)，如果存在就移動(dòng)，如果不存在就添加。

你可以：

$("ul").find("li:first").clone().appendTo($("ul")); //使用clone() 復(fù)制一個(gè)再添加。

Jquery如何選取元素及其所有子元素？

$("div")//選取div

$("divp")//選取div的子元素p

jQuery 選擇器大全

$("#myELement")????選擇id值等于myElement的元素，id值不能重復(fù)在文檔中只能有一個(gè)id值是myElement所以得到的是唯一的元素?

$("div")???????????選擇所有的div標(biāo)簽元素，返回div元素?cái)?shù)組?

$(".myClass")??????選擇使用myClass類(lèi)的css的所有元素?

$("*")?????????????選擇文檔中的所有的元素，可以運(yùn)用多種的選擇方式進(jìn)行聯(lián)合選擇：例如$("#myELement,div,.myclass")?

層疊選擇器：?

$("form?input")?????????選擇所有的form元素中的input元素?

$("#main??*")??????????選擇id值為main的所有的子元素?

$("label?+?input")?????選擇所有的label元素的下一個(gè)input元素節(jié)點(diǎn)，經(jīng)測(cè)試選擇器返回的是label標(biāo)簽后面直接跟一個(gè)input標(biāo)簽的所有input標(biāo)簽元素?

$("#prev?~?div")???????同胞選擇器，該選擇器返回的為id為prev的標(biāo)簽元素的所有的屬于同一個(gè)父元素的div標(biāo)簽?

基本過(guò)濾選擇器：?

$("tr:first")???????????????選擇所有tr元素的第一個(gè)?

$("tr:last")????????????????選擇所有tr元素的最后一個(gè)?

$("input:not(:checked)?+?span")???

過(guò)濾掉：checked的選擇器的所有的input元素?

$("tr:even")???????????????選擇所有的tr元素的第0，2，4...?...個(gè)元素（注意：因?yàn)樗x擇的多個(gè)元素時(shí)為數(shù)組，所以序號(hào)是從0開(kāi)始）?

$("tr:odd")????????????????選擇所有的tr元素的第1，3，5...?...個(gè)元素?

$("td:eq(2)")?????????????選擇所有的td元素中序號(hào)為2的那個(gè)td元素?

$("td:gt(4)")?????????????選擇td元素中序號(hào)大于4的所有td元素?

$("td:ll(4)")??????????????選擇td元素中序號(hào)小于4的所有的td元素?

$(":header")?

$("div:animated")?

內(nèi)容過(guò)濾選擇器：?

$("div:contains('John')")?選擇所有div中含有John文本的元素?

$("td:empty")???????????選擇所有的為空（也不包括文本節(jié)點(diǎn)）的td元素的數(shù)組?

$("div:has(p)")????????選擇所有含有p標(biāo)簽的div元素?

$("td:parent")??????????選擇所有的以td為父節(jié)點(diǎn)的元素?cái)?shù)組?

可視化過(guò)濾選擇器：?

$("div:hidden")????????選擇所有的被hidden的div元素?

$("div:visible")????????選擇所有的可視化的div元素?

屬性過(guò)濾選擇器：?

$("div[id]")??????????????選擇所有含有id屬性的div元素?

$("input[name='newsletter']")????選擇所有的name屬性等于'newsletter'的input元素?

$("input[name!='newsletter']")?選擇所有的name屬性不等于'newsletter'的input元素?

$("input[name^='news']")?????????選擇所有的name屬性以'news'開(kāi)頭的input元素?

$("input[name$='news']")?????????選擇所有的name屬性以'news'結(jié)尾的input元素?

$("input[name*='man']")??????????選擇所有的name屬性包含'news'的input元素?

$("input[id][name$='man']")????可以使用多個(gè)屬性進(jìn)行聯(lián)合選擇，該選擇器是得到所有的含有id屬性并且那么屬性以man結(jié)尾的元素?

子元素過(guò)濾選擇器：?

$("ul?li:nth-child(2)"),$("ul?li:nth-child(odd)"),$("ul?li:nth-child(3n?+?1)")?

$("div?span:first-child")??????????返回所有的div元素的第一個(gè)子節(jié)點(diǎn)的數(shù)組?

$("div?span:last-child")???????????返回所有的div元素的最后一個(gè)節(jié)點(diǎn)的數(shù)組?

$("div?button:only-child")???????返回所有的div中只有唯一一個(gè)子節(jié)點(diǎn)的所有子節(jié)點(diǎn)的數(shù)組?

表單元素選擇器：?

$(":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")???????????????選擇所有類(lèi)型為hidden的input元素或表單的隱藏域?

表單元素過(guò)濾選擇器：?

$(":enabled")?????????????選擇所有的可操作的表單元素?

$(":disabled")????????????選擇所有的不可操作的表單元素?

$(":checked")????????????選擇所有的被checked的表單元素?

$("select?option:selected")?選擇所有的select?的子元素中被selected的元素?

選取一個(gè)?name?為”S_03_22″的input?text框的上一個(gè)td的text值

$(”input[@?name?=S_03_22]“).parent().prev().text()?

名字以”S_”開(kāi)始，并且不是以”_R”結(jié)尾的

$(”input[@?name?^='S_']“).not(”[@?name?$='_R']“)?

一個(gè)名為?radio_01的radio所選的值

$(”input[@?name?=radio_01][@checked]“).val();?

$("A?B")?查找A元素下面的所有子節(jié)點(diǎn)，包括非直接子節(jié)點(diǎn)

$("AB")?查找A元素下面的直接子節(jié)點(diǎn)

$("A+B")?查找A元素后面的兄弟節(jié)點(diǎn)，包括非直接子節(jié)點(diǎn)

$("A~B")?查找A元素后面的兄弟節(jié)點(diǎn)，不包括非直接子節(jié)點(diǎn)?

1.?$("A?B")?查找A元素下面的所有子節(jié)點(diǎn)，包括非直接子節(jié)點(diǎn)?

例子：找到表單中所有的?input?元素?

HTML?代碼:?

form

labelName:/label

input?name="name"?/

fieldset

labelNewsletter:/label

input?name="newsletter"?/

/fieldset

/form

input?name="none"?/?

jQuery?代碼:?

$("form?input")?

結(jié)果:?

[?input?name="name"?/,?input?name="newsletter"?/?]?

2.?$("AB")?查找A元素下面的直接子節(jié)點(diǎn)?

例子：匹配表單中所有的子級(jí)input元素。?

HTML?代碼:?

form

labelName:/label

input?name="name"?/

fieldset

labelNewsletter:/label

input?name="newsletter"?/

/fieldset

/form

input?name="none"?/?

jQuery?代碼:?

$("form??input")?

結(jié)果:?

[?input?name="name"?/?]?

3.?$("A+B")?查找A元素后面的兄弟節(jié)點(diǎn)，包括非直接子節(jié)點(diǎn)?

例子：匹配所有跟在?label?后面的?input?元素?

HTML?代碼:?

form

labelName:/label

input?name="name"?/

fieldset

labelNewsletter:/label

input?name="newsletter"?/

/fieldset

/form

input?name="none"?/?

jQuery?代碼:?

$("label?+?input")?

結(jié)果:?

[?input?name="name"?/,?input?name="newsletter"?/?]?

4.?$("A~B")?查找A元素后面的兄弟節(jié)點(diǎn)，不包括非直接子節(jié)點(diǎn)?

例子：找到所有與表單同輩的?input?元素?

HTML?代碼:?

form

labelName:/label

input?name="name"?/

fieldset

labelNewsletter:/label

input?name="newsletter"?/

/fieldset

/form

input?name="none"?/?

jQuery?代碼:?

$("form?~?input")?

結(jié)果:?

[?input?name="none"?/?]

文章題目：jquery第一個(gè)子節(jié)點(diǎn),jquery節(jié)點(diǎn)操作
文章地址：http://m.newbst.com/article14/phhsge.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供外貿(mào)網(wǎng)站建設(shè)、定制開(kāi)發(fā)、網(wǎng)頁(yè)設(shè)計(jì)公司、云服務(wù)器、網(wǎng)站排名、網(wǎng)站制作

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶(hù)投稿、用戶(hù)轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀(guān)點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話(huà)：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來(lái)源： 創(chuàng)新互聯(lián)