jquery第六期：位置选择器
<html>
<head>
<script type="text/javascript" src="jquery-1.10.1.js"></script>
<script type="text/javascript">
$(function()
{
alert($("tr:first").html());
alert($("tr:last").html())
});
</script>
</head>
<body>
<table width="300" border="1" align="center" >
<tr>
<td>用户标识</td>
<td>用户姓名</td>
<td>用户年龄</td>
<td>用户密码</td>
</tr>
<tr>
<td>A</td>
<td>张三</td>
<td>12</td>
<td>hehe1</td>
</tr>
<tr>
<td>B</td>
<td>李四</td>
<td>13</td>
<td>hehe2</td>
</tr>
<tr>
<td>C</td>
<td>王五</td>
<td>14</td>
<td>hehe3</td>
</tr>
<tr>
<td>D</td>
<td>牛六</td>
<td>15</td>
<td>hehe4</td>
</tr>
</body>
</html>
tr：first 第一个与tr标签匹配
tr：last 最后一个与tr标签匹配
运行结果，连续两个提示框：
first-child：
<html>
<head>
<script type="text/javascript" src="jquery-1.10.1.js"></script>
<script type="text/javascript">
$(function()
{
$("tr:first-child").css("color","red");
});
</script>
</head>
<body>
<table width="300" border="1" align="center" >
<tr>
<td>用户标识</td>
<td>用户姓名</td>
<td>用户年龄</td>
<td>用户密码</td>
</tr>
<tr>
<td>A</td>
<td>张三</td>
<td>12</td>
<td>hehe1</td>
</tr>
<tr>
<td>B</td>
<td>李四</td>
<td>13</td>
<td>hehe2</td>
</tr>
<tr>
<td>C</td>
<td>王五</td>
<td>14</td>
<td>hehe3</td>
</tr>
<tr>
<td>D</td>
<td>牛六</td>
<td>15</td>
<td>hehe4</td>
</tr>
</table>
</body>
</html>
获取第一个匹配的tr
运行结果：
last-child：
<html>
<head>
<script type="text/javascript" src="jquery-1.10.1.js"></script>
<script type="text/javascript">
$(function()
{
$("tr:last-child").css("color","red");
});
</script>
</head>
<body>
<table width="300" border="1" align="center" >
<tr>
<td>用户标识</td>
<td>用户姓名</td>
<td>用户年龄</td>
<td>用户密码</td>
</tr>
<tr>
<td>A</td>
<td>张三</td>
<td>12</td>
<td>hehe1</td>
</tr>
<tr>
<td>B</td>
<td>李四</td>
<td>13</td>
<td>hehe2</td>
</tr>
<tr>
<td>C</td>
<td>王五</td>
<td>14</td>
<td>hehe3</td>
</tr>
<tr>
<td>D</td>
<td>牛六</td>
<td>15</td>
<td>hehe4</td>
</tr>
</table>
</body>
</html>
运行结果：
nth-child（n）：
<html>
<head>
<script type="text/javascript" src="jquery-1.10.1.js"></script>
<script type="text/javascript">
$(function()
{
$("tbody tr:nth-child(2)").css("color","red");
});
</script>
</head>
<body>
<table width="300" border="1" align="center" >
<tr>
<td>用户标识</td>
<td>用户姓名</td>
<td>用户年龄</td>
<td>用户密码</td>
</tr>
<tbody>
<tr>
<td>A</td>
<td>张三</td>
<td>12</td>
<td>hehe1</td>
</tr>
<tr>
<td>B</td>
<td>李四</td>
<td>13</td>
<td>hehe2</td>
</tr>
<tr>
<td>C</td>
<td>王五</td>
<td>14</td>
<td>hehe3</td>
</tr>
<tr>
<td>D</td>
<td>牛六</td>
<td>15</td>
<td>hehe4</td>
</tr>
</tbody>
</table>
</body>
</html>
运行结果：
jquery第六期：位置选择器的更多相关文章
- JQuery --- 第六期 (Ajax)
欢迎访问我的个人博客,获取更多有用的东西 链接一 链接二 也可以关注我的微信订阅号:CN丶Moti 点击查看Ajax
- jQuery学习- 位置选择器
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- jQuery常用方法（四）-选择器
JQuery Selectors 方法说明 基本选择器 $("#myDiv") 匹配唯一的具有此id值的元素 $("div") 匹配指定名称的所有元素 $(&q ...
- jquery css事件编程 位置 操作
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- jQuery表单对象属性过滤选择器
jQuery表单对象属性过滤选择器 <div id="p1" attr="p1"> <input type="text" ...
- 用Jquery做一个时间日期选择器
今天我们就用Jquery做一个时间日期选择器,当打开网页时,文本框里面显示的是当前的日期,点击文本框可以出现年.月.日的下拉菜单,并且可以选择,会根据年份的选择判断是否是闰年,从而改变二月的天数,闰年 ...
- 计算两个集合的差集——第六期 Power8 算法挑战赛
第六期Power8大赛 1.1 比赛题目 题目: 计算两个集合的差集: 详细说明: 分别有集合A和B两个大数集合,求解集合A与B的差集(A中有,但B中无的元素),并将结果保存在集合C中,要求集合C中的 ...
- jQuery中first-child与first选择器区别
1.first-child first-child为每个父级元素匹配第一个子元素,可以匹配出多个元素: 示例代码: <!DOCTYPE html> <html lang=" ...
- jquery offset positon 获取位置不准的解决方法
问题: 本地开发时,由于使用了图片,而且使用了offset().top涉及到图片所在的div距离计算的部分,本地开发一切都没问题:但是部署到服务器上时却出现布局错乱,经过排查发现总是少了一个图片高度的 ...
随机推荐
- Java Timer 定时器的使用
设置定时任务很简单,用Timer类就搞定了. 一.延时执行首先,我们定义一个类,给它取个名字叫TimeTask,我们的定时任务,就在这个类的main函数里执行. 代码如下:package test;i ...
- VS2010之MFC串口通信的编写教程--转
http://wenku.baidu.com/link?url=K1XPdj9Dcf2of_BsbIdbPeeZ452uJqiF-s773uQyMzV2cSaPRIq6RddQQH1zr1opqVBM ...
- virtIO驱动安装
- spring 配置文件XSD地址
这边部署不能访问外网,所以sping配置文件里的XSD地址要改一下象 http://www.springframework.org/schema/beans/spring-beans-2.0.xsd ...
- centos Minicom通信终端
minicom是linux下的串口通信软件,他使用完全使用键盘操作.它虽然没有windows下的超级终端好用,但是它也是一种串口通信的方法.一.minicom安装在超级终端中输入:sally@sall ...
- 如何备份及恢复Linux文件权限
你可能听说或碰到过这样的事情:一个系统管理员菜鸟不小心输入"chmod -R 777 /"从而导致了巨大的悲剧,使得整个系统遭到了严重的破坏.在日常管理中,我们有许多工具可以用来备 ...
- [置顶] 使用struts拦截器+注解实现网络安全要求中的日志审计功能
J2EE项目中出于安全的角度考虑,用户行为审计日志功能必不可少,通过本demo可以实现如下功能: 1.项目中记录审计日志的方法. 2.struts拦截器的基本配置和使用方法. 3.struts拦截器中 ...
- 应用Observer接口实践Observer模式
原文:http://zhangjunhd.blog.51cto.com/113473/68949/ 在Java中通过Observable类和Observer接口实现了观察者模式.Observer对象是 ...
- 利用java反射机制 读取配置文件 实现动态类载入以及动态类型转换
作者:54dabang 在spring的学习过程之中,我们能够看出通过配置文件来动态管理bean对象的优点(松耦合 能够让零散部分组成一个总体,而这些总体并不在意之间彼此的细节,从而达到了真正的物理上 ...
- 单片机C语言中标志位的经典应用
/* 本例程是C语言的位域操作示例 这里为什么位域结构体与联合体一起使用? -->因为这样定义后,即可以单独使用标志位 也可同时使用整个字节数据 主要应用:单片机C语言 好处:用标志位可以节省R ...