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距离计算的部分,本地开发一切都没问题:但是部署到服务器上时却出现布局错乱,经过排查发现总是少了一个图片高度的 ...
随机推荐
- SQL使用单引号
SQL> select 'xxxx'oooo' from dual; ERROR: ORA-01756: quoted string not properly terminated SQL> ...
- Linux企业级项目实践之网络爬虫（17）——存储页面
在爬虫系统中数据的流量相当大,要处理的数据内容不仅包括爬虫系统的各种数据结构空间,而且包括从外部节点中得到的各种数据,比如HTTP请求,HTML页面,ROBOT.TXT等等.如果对这些内容处理不当,那 ...
- JAVA语言学校的危险性
Java语言学校的危险性(译文) 作者: 阮一峰 日期: 2008年12月 7日 下面的文章是More Joel on Software一书的第8篇. 我觉得翻译难度很大,整整两个工作日,每天8小时以 ...
- spring笔记（一）
这几日,在看spring框架的知识,了解了一下spring的IoC核心,AOP的概念,然后剩下的其实就是Spring对于其他的java服务的封装:ORM,web, JMS,JMX等. 坦白地说,我并没 ...
- bzoj1151
题目:http://www.lydsy.com/JudgeOnline/problem.php?id=1151 状压DP,枚举前面4个,使得环型变线型. #include<cstdio> ...
- Codeforces Round #322 (Div. 2) —— F. Zublicanes and Mumocrates
It's election time in Berland. The favorites are of course parties of zublicanes and mumocrates. The ...
- 一个session已经ACTIVE20多小时，等待事件SQL*Net more data from client
问题描述: 一个session已经ACTIVE20多小时,等待事件SQL*Net more data from client 有一人session,从昨天上午11点多登陆(v$session.logi ...
- c++之命名空间namespace
1命名空间解决全局变量的冲突 main.h文件 #pragma once // data命名空间的名称 namespace data { ;//外部全局变量冲突 } main.cpp #include ...
- 关于bootstrap--网格系统
1. 2.偏移列(col-md-offset-*):为了在大屏幕显示器上使用偏移,请使用 .col-md-offset-* 类.这些类会把一个列的左外边距(margin)增加 * 列,其中 * 范围是 ...
- ubuntu14.04折腾迅雷xware
迅雷一直没有出linux版,wine不想去弄.linux下虽然也有各种bt软件,无奈我试用后却发现速度远比不上迅雷,甚至有些资源根本找不到.而有些迅雷的专用链接,更是没法下(原谅我2M的小水管,却喜欢 ...