初識(shí)JQuery 實(shí)例一(first)

更新時(shí)間：2011年03月16日 23:51:02 作者：

用jquery為ul下的li依次設(shè)置樣式的代碼，主要是利用了first,next方法。

完整代碼:

<!DOCTYPE html> 
<html> 
<head> 
<style type="text/css"> 
.highlight 
{ 
background-color: yellow; 
} 
.gray 
{ 
background-color: Gray; 
} 
</style> 
<script src="http://code.jquery.com/jquery-1.5.js"></script> 
</head> 
<body> 
<ul> 
<li>Look:</li> 
<li>This is some text in a paragraph.</li> 
<li>This is a note about it.</li> 
</ul> 
<script type="text/javascript"> 
$("ul li").first().addClass('highlight'); 
jQuery("ul li").first().next().addClass('gray'); 
</script> 
</body> 
</html>

您可能感興趣的文章:

相關(guān)文章

jQuery的$.proxy()應(yīng)用示例介紹
這篇文章主要介紹了jQuery的$.proxy()應(yīng)用,需要的朋友可以參考下
2014-04-04
淺談jQuery中ajaxPrefilter的應(yīng)用
下面小編就為大家?guī)?lái)一篇淺談jQuery中ajaxPrefilter的應(yīng)用。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來(lái)看看吧
2016-08-08
jQuery多個(gè)input求和的實(shí)現(xiàn)方法
這篇文章主要介紹了jQuery多個(gè)input求和的實(shí)現(xiàn)方法,涉及jQuery獲取input表單元素值及運(yùn)算的相關(guān)技巧,需要的朋友可以參考下
2015-02-02
jquery簡(jiǎn)單的彈出層浮動(dòng)層代碼
一個(gè)簡(jiǎn)單的jquery彈出框代碼實(shí)現(xiàn)，點(diǎn)擊鏈接彈出模式對(duì)話框，任意點(diǎn)擊網(wǎng)頁(yè)的其它地方可以關(guān)閉彈出框，可以自定義透明度，簡(jiǎn)單實(shí)用的jquery彈出框效果。
2015-04-04
JQuery學(xué)習(xí)筆錄簡(jiǎn)單的JQuery
尺寸小、使用簡(jiǎn)單方便（Write Less, Do More，吃得少干得多，而且目前許多大公司都在支持JQuery，例如微軟，微軟把JQuery繼承在了vs2010中
2012-04-04
jQuery基于隨機(jī)數(shù)解決中午吃什么去哪吃問題示例
這篇文章主要介紹了jQuery基于隨機(jī)數(shù)解決中午吃什么去哪吃問題,涉及jQuery基于事件響應(yīng)及隨機(jī)數(shù)動(dòng)態(tài)操作頁(yè)面元素相關(guān)實(shí)現(xiàn)技巧,需要的朋友可以參考下
2018-12-12
jQuery獲取checkboxlist的value值的方法
最近著手一個(gè)項(xiàng)目用到了服務(wù)器空間checkboxlist ,使用起來(lái)是方便，可以想要從js獲取值就稍微麻煩點(diǎn)了，google后找到了如下方法，感興趣的小伙伴們可以參考一下
2015-09-09
jQuery中的siblings()是什么意思(推薦)
siblings()方法返回被選元素的所有同級(jí)元素。同級(jí)元素是共享相同父元素的元素。但是很多朋友不清楚jQuery中的siblings()是什么意思，今天小編給大家介紹下
2016-12-12
jQuery post數(shù)據(jù)至ashx實(shí)例詳解
這篇文章主要介紹了jQuery post數(shù)據(jù)至ashx實(shí)例詳解的相關(guān)資料,需要的朋友可以參考下
2016-11-11
瀏覽器常用高寬的jquery插件
兼容BackCompat,CSS1Compat兩模式渲染的頁(yè)面,測(cè)試的瀏覽器 :friefox ie678 chrome opera
2011-02-02