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距离计算的部分,本地开发一切都没问题:但是部署到服务器上时却出现布局错乱,经过排查发现总是少了一个图片高度的 ...
随机推荐
- hdu1540-Tunnel Warfare （线段树区间合并）
题意:n个村庄,有三种操作,D x 破坏位置为x的村庄,R 修复上一次被破坏的村庄,Q x 输出含有x村庄的连续村庄的最大个数.线段树搞之,区间合并. ls[maxn]为当前节点左面的连续区间,rs[ ...
- 【剑指offer】面试题37：两个链表的第一个公共结点
题目: 输入两个链表,找出它们的第一个公共结点. 思路: 由链表的定义知是单链表.对于单链表,如果两个链表有公共结点,则两个链表必然是像Y型相交.则先计算出各个链表的长度,让长链表的头指针先走多出来的 ...
- 502 bad gateway是什么意思
通俗解释一下 1.什么是502 bad gateway 报错? 简单来说 502 是报错类型代码 bad gateway 错误的网关 2.产生错误的原因 连接超时 我们向server器发送请求 因为s ...
- Laravel Cheat 表 http://cheats.jesse-obrien.ca/#
Laravel Cheat Sheet Toggle Code Comments PDF Version Github Laravel 3 Docs Laravel 4 Docs Artisan ph ...
- VMware vSphere 5.5的12个更新亮点(1)
[IT专家网虚拟化]在VMworld 2013大会上发布的VMware vSphere 5.5版本提供的增强和改进,横跨从hypervisor到管理整个堆栈,提升了VMware的性能.可伸缩性和可用性 ...
- this关键字的解析
this关键字的作用: 1.表示类中的属性. class Person{ // 定义Person类 private String name ; // 姓名 private int age ; // 年 ...
- iOS中的界面多选功能－－（UICollectionView）
文/Jacob_Pan(简书作者)原文链接:http://www.jianshu.com/p/9d28ebd0f5a2著作权归作者所有,转载请联系作者获得授权,并标注“简书作者”. 最近做项目接触了一 ...
- Android万能分辨率适应法
(1)获取屏幕的尺寸 WindowManager windowManager = (WindowManager) getSystemService(Context.WINDOW_SERVICE); D ...
- 配置linux中文
1.~/.bash_profile文件添加一下内容并执行source ~/.bash_profile export NLS_LANG=AMERICAN_AMERICA.ZHS16GBK 2./etc ...
- C# 将对象序列化为Json格式
public static string JsonSerializer<T>(T t) { DataContractJsonSerializer ser = new DataContrac ...