jQuery中slice()方法用法實(shí)例
本文實(shí)例講述了jQuery中slice()方法用法。分享給大家供大家參考。具體分析如下:
此方法可以選取匹配元素集的子集。
語法結(jié)構(gòu):
參數(shù)列表:
實(shí)例代碼:
實(shí)例一:
選取第一個(gè)元素
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="http://www.dbjr.com.cn/" />
<title>腳本之家</title>
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("li").slice(0,1).css("color","red")
})
</script>
</head>
<body>
<div>
<ul>
<li>HTML專區(qū)</li>
<li class="js">Javascript專區(qū)</li>
<li>Div+Css專區(qū)</li>
<li>Jquery專區(qū)</li>
</ul>
</div>
</body>
</html>
實(shí)例二:
選取前兩個(gè)元素
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="http://www.dbjr.com.cn/" />
<title>腳本之家</title>
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("li").slice(0,2).css("color","red")
})
</script>
</head>
<body>
<div>
<ul>
<li>HTML專區(qū)</li>
<li class="js">Javascript專區(qū)</li>
<li>Div+Css專區(qū)</li>
<li>Jquery專區(qū)</li>
</ul>
</div>
</body>
</html>
實(shí)例三:
選取第二個(gè)元素
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="http://www.dbjr.com.cn/" />
<title>腳本之家</title>
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("li").slice(1,2).css("color","red")
})
</script>
</head>
<body>
<div>
<ul>
<li>HTML專區(qū)</li>
<li class="js">Javascript專區(qū)</li>
<li>Div+Css專區(qū)</li>
<li>Jquery專區(qū)</li>
</ul>
</div>
</body>
</html>
實(shí)例四:
選取最后一個(gè)元素
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="http://www.dbjr.com.cn/" />
<title>腳本之家</title>
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("li").slice(-1).css("color","red")
})
</script>
</head>
<body>
<div>
<ul>
<li>HTML專區(qū)</li>
<li class="js">Javascript專區(qū)</li>
<li>Div+Css專區(qū)</li>
<li>Jquery專區(qū)</li>
</ul>
</div>
</body>
</html>
希望本文所述對(duì)大家的jQuery程序設(shè)計(jì)有所幫助。
相關(guān)文章
jQuery鼠標(biāo)經(jīng)過方形圖片切換成圓邊效果代碼分享
這篇文章主要介紹了jQuery鼠標(biāo)經(jīng)過方形圖片切換成圓邊特效,圖片可以自行替換,推薦給大家,有需要的小伙伴可以參考下。2015-08-08jQuery3.0中的buildFragment私有函數(shù)詳解
在 jQuery3.0中,buildFragment 是一個(gè)私有函數(shù),用來構(gòu)建一個(gè)包含子節(jié)點(diǎn) fragment 對(duì)象。下文給大家介紹jQuery3.0中的buildFragment私有函數(shù)詳解,對(duì)jquery3.0 buildfragment相關(guān)知識(shí)感興趣的朋友一起學(xué)習(xí)吧2016-08-08JQuery解析XML數(shù)據(jù)的幾個(gè)簡單實(shí)例
下面小編就為大家?guī)硪黄狫Query解析XML數(shù)據(jù)的幾個(gè)簡單實(shí)例。小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2016-05-05jQuery實(shí)現(xiàn)動(dòng)畫效果的簡單實(shí)例
本篇文章主要是對(duì)jQuery實(shí)現(xiàn)動(dòng)畫效果的簡單實(shí)例進(jìn)行了介紹,需要的朋友可以過來參考下,希望對(duì)大家有所幫助2014-01-01JavaScript jQuery 中定義數(shù)組與操作及jquery數(shù)組操作
這篇文章主要介紹了JavaScript jQuery 中定義數(shù)組與操作及jquery數(shù)組操作的相關(guān)資料,需要的朋友可以參考下2015-12-12jQuery獲取多種input值的簡單實(shí)現(xiàn)方法
下面小編就為大家?guī)硪黄猨Query獲取多種input值的簡單實(shí)現(xiàn)方法。小編覺得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2016-06-06