jquery獲取當(dāng)前節(jié)點(diǎn)的前一個(gè)節(jié)點(diǎn)步驟如下:

網(wǎng)站制作、成都網(wǎng)站建設(shè)的關(guān)注點(diǎn)不是能為您做些什么網(wǎng)站,而是怎么做網(wǎng)站,有沒(méi)有做好網(wǎng)站,給創(chuàng)新互聯(lián)公司一個(gè)展示的機(jī)會(huì)來(lái)證明自己,這并不會(huì)花費(fèi)您太多時(shí)間,或許會(huì)給您帶來(lái)新的靈感和驚喜。面向用戶友好,注重用戶體驗(yàn),一切以用戶為中心。
1、打開(kāi)html開(kāi)發(fā)工具,新建一個(gè)html代碼頁(yè)面。
2、在html頁(yè)面創(chuàng)建三個(gè)p標(biāo)簽,然后給這三個(gè)p標(biāo)簽設(shè)置不同的內(nèi)容。
3、引入jquery庫(kù)。在title標(biāo)簽后面引用下載好的jquery.js文件。
4、?在jquery引用庫(kù)標(biāo)簽后面新建一個(gè)script標(biāo)簽,然后在這個(gè)標(biāo)簽里面添加一個(gè)DOM加載完成后執(zhí)行函數(shù)。
5、在DOM加載完成后執(zhí)行函數(shù)里面添加點(diǎn)擊p標(biāo)簽時(shí)獲取當(dāng)前元素的上一個(gè)元素對(duì)象。
6、保存html代碼后使用瀏覽器打開(kāi),然后點(diǎn)擊p標(biāo)簽彈出框就會(huì)顯示當(dāng)前點(diǎn)擊標(biāo)簽的上一個(gè)標(biāo)簽的內(nèi)容。
通過(guò)children
children("input:first-child")
$(this).children("input:first-child").val();
$(this).children("input:last-child").val();
通過(guò)選擇器,$(".itemsinput:first")
1. 通過(guò)位置選擇的操作:
:first:默認(rèn)情況下是相對(duì)整個(gè)頁(yè)面來(lái)說(shuō)的第一個(gè),如:li:first表示整個(gè)頁(yè)面的第一個(gè)li元素,而ul li:first表示整個(gè)頁(yè)面的第一個(gè)li元素,并且是在ul下的子元素;
:first- child:為每個(gè)父元素匹配第一個(gè)子元素,如li:first-child返回每個(gè)ul的第一個(gè)li元素。可以這樣理解,頁(yè)面中的元素有相同的父元素 的,并且里面又包含li元素的,那么就取第一個(gè)li元素,每個(gè)子類集合都要進(jìn)行判斷,直到找出所有符合要求的li元素;
:only- child:返回所有沒(méi)有兄弟節(jié)點(diǎn)的元素,注意,文本元素不是,也就是說(shuō)類似這樣的divhelloa href=""jquery/a/div,對(duì)于這段會(huì)選出a元素;對(duì) 于$(”label:only-child“)會(huì)選出是label元素,同時(shí)它是它父類唯一的子元素的label元素;
:nth-child(n):返回第n個(gè)子節(jié)點(diǎn),n從1開(kāi)始,如果n取0,那么就會(huì)選擇所有的元素。如:[*]li:nth-child(2)返回li元素,并且該元素是其父元素的第二個(gè)子元素;
:nth-child(even|odd):返回偶數(shù)或奇數(shù)的子節(jié)點(diǎn);
:nth-child(An+B):返回滿足表達(dá)式An+B的所有子節(jié)點(diǎn),比如3n+1返回所處位置為父節(jié)點(diǎn)子元素的是3的倍數(shù)加1的那個(gè)子元素;
:even:頁(yè)面范圍內(nèi)的處于偶數(shù)位置的元素,如:li:even返回全部偶數(shù)li元素;
:odd:頁(yè)面范圍內(nèi)的處于奇數(shù)位置的元素;
:eq(n):第n個(gè)匹配的元素(n從0開(kāi)始),如:li:eq(3)返回整個(gè)頁(yè)面的第四個(gè)li元素,ul li:eq(1)返回頁(yè)面中第一個(gè)ul元素下的第二個(gè)li元素,注意:只匹配一次就返回了;
:gt(n):第n個(gè)匹配元素(不包括)之后的元素(n從0開(kāi)始),如:ul:gt(2)返回從第3個(gè)ul開(kāi)始的所有ul元素(含第三個(gè));
:lt(n):第n個(gè)匹配元素(不包括)之前的元素(n從0開(kāi)始),如:ul:lt(2)返回從第0個(gè)和第1個(gè)ul元素;
2. 利用css選擇器進(jìn)行選擇:
元素標(biāo)簽名:比如說(shuō)$(”a“)會(huì)選出所有鏈接元素;
#id:通過(guò)元素id進(jìn)行選擇,比如說(shuō)$("#form1")會(huì)選擇id為form1的元素;
.class:通過(guò)元素的CSS類來(lái)選擇,比如說(shuō)$(".boldstyle")會(huì)選擇CSS為boldstyle類的元素;
標(biāo)簽 名#id.class:通過(guò)某類元素的id屬性和class屬性來(lái)選擇,如:$(a#blog.boldStyle)會(huì)選擇id為blog并且CSS類型 為.boldStyle類型的鏈接元素(a id='blog' class='.boldStyle');
父標(biāo)簽名 子標(biāo)簽名.class:通過(guò)選擇父標(biāo)簽下的某種CSS類型的子元素,如:$(p a.redStyle)會(huì)選擇p段落元素中的鏈接子元素a,且其css類型為.redStyle;
3. 通過(guò)子選擇器,容器選擇器和屬性選擇器進(jìn)行選擇:
*:匹配所有的元素,比如說(shuō):$(*)會(huì)把頁(yè)面中的所有元素都返回;
E:匹配標(biāo)簽名為E的所有元素,如$("a")返回所有鏈接元素;
E F:匹配父元素E下的標(biāo)簽名為F的所有子元素(F可以為E的子類的子類,甚至更遠(yuǎn));
EF:匹配父元素E下的所有標(biāo)簽名為F的直接子元素;
E+F:匹配所有標(biāo)簽名為F的元素,并且有E類型的兄弟節(jié)點(diǎn)在該F元素之前(E,F緊挨著);
E~F:匹配前面是任何兄弟節(jié)點(diǎn)E的所有元素F(E,F不必緊挨著);
E:has(F):匹配標(biāo)簽名為E,至少有一個(gè)標(biāo)簽名為F的后代節(jié)點(diǎn)的所有元素E;
E.C:匹配帶有類名C的所有元素E。.C等效于*.C;
E#I:匹配id為I的所有元素E,#I等效于*#I;
E[A]:匹配帶有屬性A的所有元素E;
E[A=V]:匹配所有屬性A的值為V的元素E;
E[A^=V]:匹配所有元素E,且A的屬性值是V開(kāi)頭的;
E[A$=V]:匹配所有元素E,且A的屬性值是V結(jié)尾的;
E[A*=V]:匹配所有元素E,且A的屬性值中包含有V;
4.利用jQuery自定義的選擇器進(jìn)行選擇:
:button:選擇任何按鈕類型的元素,包括input[type=submit]等等;
:checkbox:選擇復(fù)選框元素;
:file:選擇所有文件類型元素,即input[type=file];
:image:選擇表單中的圖像元素,即input[type=image],注意此處和前面根據(jù)標(biāo)簽名img選擇圖像有點(diǎn)不同哈;
:input:選擇表單元素,如input,select,textarea,button等;
:radio:選擇單選按鈕元素;
:reset:選擇復(fù)位按鈕元素,如input[type=reset],button[type=reset];
:submit:選擇提交按鈕元素;
:text:選擇文本字段元素,即input[type=text];
:animated:選擇當(dāng)前處于動(dòng)態(tài)控制下的元素;
:contains(hello):選擇包含文本hello的元素;
:header:選擇標(biāo)題元素,如h1;
:parent:選擇擁有后代節(jié)點(diǎn)(包括文本)的元素,而排除空元素;
:selected:選擇已選中的選項(xiàng)元素;
:visible:選擇可見(jià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
標(biāo)題名稱:jquery獲取第一個(gè)子節(jié)點(diǎn),jquery獲取第一個(gè)子元素的值
本文來(lái)源:http://chinadenli.net/article23/dsshdcs.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供微信公眾號(hào)、建站公司、外貿(mào)網(wǎng)站建設(shè)、網(wǎng)站維護(hù)、網(wǎng)站收錄、軟件開(kāi)發(fā)
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來(lái)源: 創(chuàng)新互聯(lián)