JQUERY1.9学习笔记 之基本过滤器(二) 等于选择器
等于选择器 :eq()
描述：选择与设定下标匹配的元素。
jQuery( ":eq(index)" )
jQuery( ":eq(-index)" )
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="utf-8">
<title>find the third td</title>
<script src="js/jquery-1.9.1.min.js"></script>
</head>
<body>
<table border="1">
<tr><td>TD #0</td><td>TD #1</td><td>TD #2</td></tr>
<tr><td>TD #3</td><td>TD #4</td><td>TD #5</td></tr>
<tr><td>TD #6</td><td>TD #7</td><td>TD #8</td></tr>
</table>
<script>
$("td:eq(2)").css("color", "red");
</script>
</body>
</html>
例子：用三个不同的样式去证明:eq()是为选择单元素而设计的，
然而，:nth-child()或:eq()在一个循环结构中，如.each()就能
选择多个元素。
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="utf-8">
<title>eq demo</title>
<style>
</style>
<script src="js/jquery-1.9.1.min.js"></script>
</head>
<body>
<ul class="nav">
<li>List 1, item 1</li>
<li>List 1, item 2</li>
<li>List 1, item 3</li>
</ul>
<ul class="nav">
<li>List 2, item 1</li>
<li>List 2, item 2</li>
<li>List 2, item 3</li>
</ul>
<script>
// Applies yellow background color to a single <li>
$("ul.nav li:eq(1)").css("background-color","#ff0");
// Applies italics to text of the second <li> within each <ul class="nav">
$("ul.nav").each(function(index){
$(this).find("li:eq(1)").css("font-style","italic");
});
// Applies red text color to descendants of <ul class="nav">
// for each <li> that is the second child of its parent
$("ul.nav li:nth-child(2)").css("color","red");
</script>
</body>
</html>
Example: Add a class to List 2, item 2 by targeting the second to last <li>
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="utf-8">
<title>eq demo</title>
<style>
.foo{
color:blue;
background-color:yellow;
}
</style>
<script src="js/jquery-1.9.1.min.js"></script>
</head>
<body>
<ul class="nav">
<li>List 1, item 1</li>
<li>List 1, item 2</li>
<li>List 1, item 3</li>
</ul>
<ul class="nav">
<li>List 2, item 1</li>
<li>List 2, item 2</li>
<li>List 2, item 3</li>
</ul>
<script>
$("li:eq(-2)").addClass("foo");
</script>
</body>
</html>
JQUERY1.9学习笔记 之基本过滤器(二) 等于选择器的更多相关文章
- JQUERY1.9学习笔记 之可见性过滤器(二) 可见选择器
描述:选择所有可见的元素. 例:点击时让所有的可见的div元素变黄. <!doctype html><html lang="en"> <head> ...
- JQUERY1.9学习笔记 之内容过滤器(二) 空元素选择器
描述:选择没有子元素(包括文本节点)的标签. jQuery(":empty") 与:parent相反. 例:找出所有为空的元素.(他们没有子元素或文本元素). <!docty ...
- JQUERY1.9学习笔记 之可见性过滤器(一) 隐藏选择器
描述:选择所有隐藏的元素. jQuery( ":hidden" ) 例:显示出所有隐藏的div元素,并对隐藏的input元素计数. <!doctype html>< ...
- JQUERY1.9学习笔记 之内容过滤器(四) parent选择器
描述:选择至少包含一个子节点的元素(一个标签或是文本). 例:找出所有有子元素的td标签,包含文本. <!doctype html><html lang="en" ...
- JQUERY1.9学习笔记 之内容过滤器(三) has选择器
描述:选择至少包含一个元素,匹配指定的标签的标签.jQuery( ":has(selector)" ) 例:给所有的div添加一个类"test",在他们中有一个 ...
- JQUERY1.9学习笔记 之内容过滤器(一) 包含选择器
描述:选择包含指定文本的所有元素.jQuery( ":contains(text)" ) text:一串大小写敏感的文本. 例:找出所有包含"john"的div ...
- JQUERY1.9学习笔记 之基本过滤器(十一) 奇数选择器
奇数选择器jQuery( ":odd" ) 例:匹配表格的奇数行. <!DOCTYPE html><html lang="zh-cn"> ...
- JQUERY1.9学习笔记 之基本过滤器(十) 非选择器
非选择器jQuery( ":not(selector)" ) 例:找出所有input标签为非"checked"的,并且高亮其邻居元素span. <!DOC ...
- JQUERY1.9学习笔记 之基本过滤器(九) 小于选择器
小于选择器 jQuery( ":lt(index)" ) jQuery( ":lt(-index)" ) 描述:选择所有小于指定下标的元素. <!DOCT ...
随机推荐
- 导出数据到excel
Protected Sub cmdOrderExport_Click(ByVal sender As Object, ByVal e As EventArgs) Handles cmdOrderExp ...
- Shared and Exclusive Locks 共享和排它锁
14.5 InnoDB Locking and Transaction Model InnoDB 锁和事务模型 14.5.1 InnoDB Locking 14.5.2 InnoDB Transact ...
- 【HDOJ】3732 Ahui Writes Word
初看01背包,果断TLE.是因为n和C都比较大.但是vi和ci却很小,转化为多重背包. #include <cstdio> #include <cstring> ][]; ]; ...
- HDOJ 1163 Eddy's digital Roots 九余数定理+简单数论
我在网上看了一些大牛的题解,有些知识点不是太清楚, 因此再次整理了一下. 转载链接: http://blog.csdn.net/iamskying/article/details/4738838 ht ...
- jstat(JVM Statistics Monitoring Tool)
功能 用于监视虚拟机各种运行状态信息的命令行工具.它可以显示本地或远程虚拟机进程中的类装载.内存.垃圾收集.JIT编译等运行数据,在没有GUI图形界面,只提供了纯文本控制台环境的服务器上,它将是运 ...
- python3、selenium、autoit3，通过flash控件上传文件
autoit.au3 #include <Constants.au3> WinWait(); //暂停执行脚本,直到上传对话框出现 WinActive("打开") Wi ...
- Linux下DVD-R刻录问题
之前CD的刻录一直使用的命令行工具集cdrtools中的mkisofs.cdrecord.然后本来刻录DVD可以使用它的growisofs命令. 现在假设原始文件目录为/src/,目标目录为/dest ...
- [LeetCode] 30. Substring with Concatenation of All Words 解题思路 - Java
You are given a string, s, and a list of words, words, that are all of the same length. Find all sta ...
- Spreadsheet Calculator 电子表格计算器 (Uva 215)
原题:https://uva.onlinejudge.org/external/2/215.pdf 有一个M x N的表格,每个单元格是个数字或者表达式.表达式由单元格编号和+ - 号组成 输出单元格 ...
- GitHub 使用手册 - 基础篇
缘起 Git已经成为程序员必备技能之一,而GitHub做为做流行的Git仓库托管平台,其不仅提供Git仓库托管,还是一个非常棒的技术人员社交平台,可以通过开源的项目进行协作.交流,是现在优秀的工程师必 ...