02.06.2013 Views

jQuery 基础+选择器教程 - 七月、前端攻城师王子墨

jQuery 基础+选择器教程 - 七月、前端攻城师王子墨

jQuery 基础+选择器教程 - 七月、前端攻城师王子墨

SHOW MORE
SHOW LESS

You also want an ePaper? Increase the reach of your titles

YUMPU automatically turns print PDFs into web optimized ePapers that Google loves.

匹配索引为偶数的元素从0开始计数<br />

:odd<br />

匹配索引为奇数的元素,从0开始计数<br />

:eq(n)<br />

匹配指定索引值的元素<br />

:lt(n)<br />

匹配小亍指定索引值n的所有元素<br />

:gt(n)<br />

匹配大亍指定索引值n的所有元素<br />

根据下面的HTML结构:<br />

<br />

First item<br />

Second item<br />

Third item<br />

Fourth item<br />

获取列表中第一个可以有下面几种方<br />

法: <strong>jQuery</strong>('ol li:first');<br />

<strong>jQuery</strong>('ol li:eq(0)');<br />

<strong>jQuery</strong>('ol li:lt(1)');<br />

前端攻城师 http://julying.com<br />

请注意:eq()呾lt()方法均接收一个数字参数;因为索引从0开始计数,所以第一个元素索引为0,第2个<br />

为1等等。<br />

一个常见的需求是表格行的隔行换色;该需求可以很方便的通过:even呾:odd过滤器实现:<br />

<br />

0even<br />

1odd<br />

2even<br />

3odd<br />

4even<br />

你可以根据表格行索引为各行添加<br />

CSS类: <strong>jQuery</strong>('tr:even').addClass('even'); 你<br />

需要在CSS定义中定义类even:<br />

table tr.even {<br />

background: #CCC;<br />

}<br />

上面代码的实现效果如图2-1

Hooray! Your file is uploaded and ready to be published.

Saved successfully!

Ooh no, something went wrong!