jQuery中andSelf()方法用法實例
更新時間：2015年01月08日 12:01:31 投稿：shichen2014
這篇文章主要介紹了jQuery中andSelf()方法用法,實例分析了andSelf()方法將先前所選的元素加入當(dāng)前元素集合中的使用技巧,需要的朋友可以參考下
本文實例講述了jQuery中andSelf()方法用法。分享給大家供大家參考。具體分析如下：
此方法可以將先前所選的元素加入當(dāng)前元素集合中。
語法結(jié)構(gòu):
復(fù)制代碼 代碼如下:
.andSelf()
對于此方法可能理解起來有所困難，那么下面就詳細(xì)分析一下下面的一段實例，為了便于查看代碼，只截取了代碼中的核心內(nèi)容。
復(fù)制代碼 代碼如下:
$(".second").nextAll().css("color","green");
<ul>
<li>html專區(qū)</li>
<li class="second">DIV+CSS專區(qū)</li>
<li>Javascript專區(qū)</li>
<li>Jquery專區(qū)</li>
</ul>
以上代碼運(yùn)行之后，第三個和第四個li中的文本顏色被設(shè)置為綠色。再看下面這個代碼:
復(fù)制代碼 代碼如下:
$(".second").nextAll().andSelf().css("color","green");
<ul>
<li>html專區(qū)</li>
<li class="second">DIV+CSS專區(qū)</li>
<li>Javascript專區(qū)</li>
<li>Jquery專區(qū)</li>
</ul>
以上代碼運(yùn)行之后，第二個、第三個和第四個li中的文本顏色被設(shè)置為綠色。
兩個代碼運(yùn)行結(jié)果的差距就是因為andSelf()方法的原因。
分析一下代碼的執(zhí)行過程:首先使用類選擇器會選中第二個li元素，然后再使用nextAll()方法會把第三個和第四個元素轉(zhuǎn)化為當(dāng)前所選。如果到這里開始調(diào)用css()方法，那么就是第一段代碼的運(yùn)行結(jié)果。如果調(diào)用andSelf()方法則會把先前所選的加入到當(dāng)前元素集合中，于是再調(diào)用css()方法，三個li元素中的字體顏色都會變成綠色。
實例代碼:
復(fù)制代碼 代碼如下:
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.fzitv.net/" />
<title>腳本之家</title>
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".second").nextAll().andSelf().css("color","green");
})
</script>
</head>
<body>
<div>
<ul>
<li>html專區(qū)</li>
<li class="second">DIV+CSS專區(qū)</li>
<li>Javascript專區(qū)</li>
<li>Jquery專區(qū)</li>
</ul>
</div>
</body>
</html>
希望本文所述對大家的jQuery程序設(shè)計有所幫助。
相關(guān)文章
下面小編就為大家?guī)硪黄猨query實現(xiàn)input框獲取焦點的方法。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-02-02
下面小編就為大家?guī)硪黄猨query獲取form表單input元素值的簡單實例。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2016-05-05
從零開始學(xué)習(xí)jQuery (二) 萬能的選擇器
本章講解jQuery最重要的選擇器部分的知識. 有了jQuery的選擇器我們幾乎可以獲取頁面上任意的一個或一組對象, 可以明顯減輕開發(fā)人員的工作量.2010-10-10
對博客系統(tǒng)已經(jīng)做到了博客評論模塊部分了，對單篇博文進(jìn)行靜態(tài)化的同時對博文的評論部分采取AJAX的方式去讀取。2009-11-11
jQuery使用DataTable實現(xiàn)刪除數(shù)據(jù)后重新加載功能
利用jQuery Datatable和artTemplate組合來做的表格。但是當(dāng)刪除數(shù)據(jù)時，需要重新加載table里的數(shù)據(jù)。接下來通過本文給大家分享jQuery使用DataTable實現(xiàn)刪除數(shù)據(jù)后重新加載功能，需要的朋友參考下2017-02-02
Jquery+bootstrap實現(xiàn)表格行置頂置底上移下移操作詳解
這篇文章主要為大家詳細(xì)介紹了Jquery+bootstrap實現(xiàn)表格行置頂置底上移下移操作，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2022-02-02
這篇文章主要介紹了JQuery常見節(jié)點操作,結(jié)合實例形式分析了jQuery針對元素節(jié)點的添加、刪除常見操作函數(shù)使用技巧與相關(guān)注意事項,需要的朋友可以參考下2019-05-05
jQuery選擇器使得獲得頁面元素變得更加容易、更加靈活，從而大大減輕了開發(fā)人員的壓力。如同蓋樓一樣，沒有磚瓦，就蓋不起樓房。得不到元素談何其他各種操作呢？可見,jQuery選擇器的重要性。當(dāng)然想一下子掌握所有選擇器也是很困難的，這個得靠實踐和積累2014-03-03
關(guān)于JQuery上傳插件Uploadify使用詳解網(wǎng)上一大把，基本上內(nèi)容都一樣。我根據(jù)網(wǎng)上的步驟配置完成后，會報一些錯誤，而我根據(jù)這些錯誤去網(wǎng)上找解決方案，卻沒有相關(guān)資料，所以為了不讓更多的朋友走彎路，我把我遇到的一些問題進(jìn)行匯總，也方便我自己以后查閱。2010-04-04
使用Jquery來實現(xiàn)可以輸入值的下拉選單 雛型
最近案子中，需要使用下拉選單，但問題是，里面選項都會有各 其他：，然後 可以 讓 user 在輸入2011-12-12