jquery的位置选择器二

最新推荐文章于 2024-09-05 16:56:18 发布

piao317110771

最新推荐文章于 2024-09-05 16:56:18 发布

阅读量97

点赞数

分类专栏： jquery 文章标签： jquery的位置选择器二

本文链接：https://blog.csdn.net/piao317110771/article/details/84752145

版权

jquery 专栏收录该内容

29 篇文章 0 订阅

订阅专栏

1、代码

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=gbk" />
		<title>jquery的位置选择器二</title>
		<!--引入jquery依赖包-->
		<script type="text/javascript" src="../jquery-1.11.3.js"></script>
		<script type="text/javascript">
			$(function() {
				//获取<tbody>中的第2个<tr>节点
				//$("tbody tr:nth-child(2)").css("color","#f00");
				
				//获取<tbody>中的每个<tr>的第2个<td>节点
				//$("tbody td:nth-child(2)").css("color","#f00");
				
				//获取<tbody>中的偶数<tr>节点
				//$("tbody tr:nth-child(even)").css("color","#f00");
				//$("tbody tr:odd").css("color","#f00");
				
				//获取<tbody>中的奇数<tr>节点
				//$("tbody tr:nth-child(odd)").css("color","#f00");
				//$("tbody tr:even").css("color","#f00");
				
				//获取<tbody>中的行号【行号从0开始】大于2的<tr>节点
				//$("tbody tr:gt(2)").css("color","#f00");
				
				//获取包含内容2的<td>节点
				//$("td:contains(2)").css("color","#f00");
			});
		</script>
	</head>
	<body>
		<table width="700" border="1" align="center">
			<thead>
				<tr align="center">
					<td>用户编号</td>
					<td>用户姓名</td>
					<td>用户年龄</td>
					<td>用户密码</td>
				</tr>
			</thead>
			<tbody>
				<tr>
					<td>1</td>
					<td>张三</td>
					<td>23</td>
					<td>abc123</td>
				</tr>
				<tr>
					<td>2</td>
					<td>李四</td>
					<td>33</td>
					<td>abc123</td>
				</tr>
				<tr>
					<td>3</td>
					<td>王五</td>
					<td>43</td>
					<td>abc123</td>
				</tr>
				<tr>
					<td>4</td>
					<td>赵六</td>
					<td>53</td>
					<td>abc123</td>
				</tr>
				<tr>
					<td>5</td>
					<td>孙七</td>
					<td>63</td>
					<td>abc123</td>
				</tr>
			</tbody>
		</table>
	</body>
</html>

2、案例1