jQuery中andSelf()方法用法實例
- 巴扎黑原創
- 2017-06-24 10:33:221367瀏覽
這篇文章主要介紹了jQuery中andSelf()方法用法,實例分析了andSelf()方法將先前所選的元素加入當前元素集合中的使用技巧,需要的朋友可以參考下
本文實例講述了jQuery中andSelf()方法用法。分享給大家供大家參考。具體分析如下：
此方法可以將先前所選的元素加入目前元素集合中。
語法結構:
程式碼如下:
.andSelf()
對於此方法可能理解起來有所困難，那麼下面就詳細分析一下下面的一段實例，為了方便查看程式碼，只截取了程式碼中的核心內容。
程式碼如下:
$(".second").
next
All().css("color","green");
<ul>
<li>html专区</li>
<li class="second">p+CSS专区</li>
<li>
Javascript
专区</li>
<li>Jquery专区</li>
</ul>以上程式碼運行之後，第三個和第四個li中的文字顏色被設定為綠色。再看下面這個程式碼:
程式碼如下:
$(".second").nextAll().andSelf().css("color","green");
<ul>
<li>html专区</li>
<li class="second">p+CSS专区</li>
<li>Javascript专区</li>
<li>Jquery专区</li>
</ul>以上程式碼運行之後，第二個、第三個和第四個li中的文字顏色被設定為綠色。
兩個程式碼運行結果的差距就是因為andSelf()方法的原因。
分析程式碼的執行過程:首先使用類別選擇器會選取第二個li元素，然後再使用nextAll()方法會將第三個和第四個元素轉換為目前所選。如果到這裡開始呼叫css()方法，那麼就是第一段程式碼的運行結果。如果呼叫andSelf()方法則會把先前所選的加入到目前元素集合中，於是再呼叫css()方法，三個li元素中的字體顏色都會變成綠色。
實例程式碼:
程式碼如下:
<!DOCTYPE html>
<html>
<
head
>
<meta charset=" utf-8">
<meta name="author" content="http://www.jb51.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>
<p>
<ul>
<li>html专区</li>
<li class="second">p+CSS专区</li>
<li>Javascript专区</li>
<li>Jquery专区</li>
</ul>
</p>
</body>
</html>以上是jQuery中andSelf()方法用法實例的詳細內容。更多資訊請關注PHP中文網其他相關文章！
陳述：
本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn