jQuery遍历Table表格的行和列
2024-10-19 13:32:23
遍历Table表格的行和列,在开发中比较常用的功能,特别是前端开发人员,不多说,直接上代码,下面代码只是弹出第一列字段,请各位自己根据需求修改和扩展!
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>jQuery遍历Table表格的行和列</title>
<script type="text/javascript" src="http://localhost/libs/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript">
$(function() {
$("#tab1 tr").each(function(rowIndex) {
alert($(this).find("td").first().html());
});
});
</script>
</head>
<body>
<table id="tab1" border="1" style="border-collapse:collapse;width:100%;">
<tr style="height:30px; font-weight:bold;" align="center">
<td>序号</td>
<td>编制号</td>
<td>姓名</td>
<td>单位</td>
<td>职位</td>
</tr>
<tr style="height:30px;" align="center">
<td>01</td>
<td>BZ01</td>
<td>张三</td>
<td>编程入门</td>
<td>软件工程师</td>
</tr>
<tr style="height:30px;" align="center">
<td>02</td>
<td>BZ02</td>
<td>张四</td>
<td>网页设计</td>
<td>软件设计师</td>
</tr>
<tr style="height:30px;" align="center">
<td>03</td>
<td>BZ03</td>
<td>张五</td>
<td>软件工程</td>
<td>软件工程师</td>
</tr>
<tr style="height:30px;" align="center">
<td>04</td>
<td>BZ04</td>
<td>张六</td>
<td>数据库教程</td>
<td>数据库设计师</td>
</tr>
<tr style="height:30px;" align="center">
<td>05</td>
<td>BZ05</td>
<td>张七</td>
<td>网络技术</td>
<td>测试人员</td>
</tr>
</table>
</body>
</html>
如果出现没有效果的同学,请检查 jquery.min.js 路径引用是否正确!
最新文章
- 排序算法(JAVA)
- ArcGIS Engine 刷新问题
- C++ 非阻塞套接字的使用 (2)
- 解剖SQLSERVER 完结篇 关于Internals Viewer源代码
- SQL标签
- floor相关
- Number Sequence 分类: HDU 2015-06-19 20:54 10人阅读 评论(0) 收藏
- Java Web开发中的名词解释
- MySQL show status详解
- jQuery在on绑定事件时,使用Function.prototype.bind上下文,只能用off(event)解绑函数,否则可能导致事件叠加
- C#上传图片同时生成缩略图,控制图片上传大小。
- javascript 获取调用属性的对象
- JVM垃圾收集(GC)算法
- 手动清除mac的广告弹框病毒 MacOSDefender
- linux 软件应用
- Java中如何输出对勾,ASCII编码与字符串相互转换
- MyBatis的核心组件
- PHP开发框架比较
- java中使用for遍历集合是注意的空指针异常
- C++构造函数、new、delete