开发者社区> 技术小胖子> 正文
阿里云
为了无法计算的价值
打开APP
阿里云APP内打开

获取表格里面的tr 的第二个td

2017-11-09 1245

简介：
+关注继续查看

原生的js（javaScript）一般较复杂。

所以我们应尽量采用jQuery，因为几乎所有的项目中都引入了jQuery的资源的。



======如何在前台JS判断传的参数是否为空====

1
2
3
4
5
function test(){
    if(id!=0&&!id){ 
        alert('id是空值'); 
    }
}


=====原生JavaScript获取表格，然后获取除第一行外所有的tr，然后获取tr里面的第二个td。=========

1
2
3
4
5
6
7
8
9
10
11
12
13
onCheckAll: function () { //全选
          var table = document.getElementById("tb_table");//获取第一个表格  
          var array = table.getElementsByTagName("tr");//所有tr
          for(var i = 1; i < array.length; i++) {
             var id =  array[i].children; //第二个td
             var idtext = id[1].innerHTML;//获取值
             if(i == 1){
                 $('#selectIds').val($('#selectIds').val() + "" + idtext); 
             }else{
                 $('#selectIds').val($('#selectIds').val() + "," + idtext);
             }
            }
    }

 

======jQuery 获取表格里面的tr，然后获取td节点======

1、HTML结构

1
2
3
4
5
6
7
<table id = "test">
    <tr><td>1</td><td>1</td><td>2</td><td>3</td></tr>
    <tr><td>2</td><td>4</td><td>5</td><td>6</td></tr>
    <tr><td>3</td><td>7</td><td>8</td><td>9</td></tr>
    <tr><td>4</td><td>1</td><td>2</td><td>3</td></tr>
</table>
<input type="button" id="btn" value="设置">


2、jquery代码

第一种写法：

1
2
3
4
5
6
7
8
$(function(){
        $("#btn").click(function() {
            $("#test tr td:nth-child(2)").addClass('red');
        });
        $("#test tr").click(function() {
            $(this).children('td').eq(1).addClass('red');
        });
    });

第二种写法：

1
$("#test tr td:eq(2)")






      本文转自建波李 51CTO博客，原文链接：http://blog.51cto.com/jianboli/1918977，如需转载请自行联系原作者




版权声明：本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。

JavaScript 前端开发
javascript问题 javascript引用 javascript禁用 javascript错误 javascript结束
开发者社区 > 开发与运维 > 文章
云迁移中心
作者高分内容
更多
SQLOS's memory manager and SQL Server's Buffer Pool 3502 python开发环境搭建 15616 Android 动态加载 （一） 态加载机制 案例一 7853 FragmentTransaction.replace（） 你不知道的坑 3599 基于Rebound制造绚丽的动画效果-入门篇 3265
相关文章
it-fanzi
循环遍历获取table中的td,tr
html中获取table的td，tr数据
0 0
熟透的蜗牛
td标签不用tr强制换行
废话不多说，直接上代码。
0 0
青衫无名
td单元格合并代码实例
779 0
mr_伍先生
jquery获取table,遍历输出tr中各个td的内容（转载）
首先，依赖jquery.. 1 $('#btntb').click(function(){ 2 $('#tab tr').each(function(i){ // 遍历 tr 3 $(this).children('td').each(function(j){ // 遍历 tr 的各个 td 4 alert("第"+(i+1)+"行，第"+(j+1)+"个td的值："+$(this).text()+"。
1151 0
技术小胖子
获取tr td 的三种方式
749 0
余二五
tr命令
690 0
科技小能手
tr命令总结
673 0
技术小胖子
tr命令练习
675 0
孤独的猫董
tr使用
tr用来从标准输入中通过替换或删除操作进行字符转换。tr主要用于删除文件中控制字符或进行字符转换。 tr中特定控制字符的不同表达方式 速记符　　   　　 含义                       八进制方式 \a　　　　　　　Ctrl-G铃声                \007　...
470 0
y0umer
在一个td里面怎么让两个div重叠
     
428 0
+关注
技术小胖子
文章
问答
作者高分内容
更多
SQLOS's memory manager and SQL Server's Buffer Pool 3502 python开发环境搭建 15616 Android 动态加载 （一） 态加载机制 案例一 7853 FragmentTransaction.replace（） 你不知道的坑 3599 基于Rebound制造绚丽的动画效果-入门篇 3265
文章排行榜
最热
最新
1 承上启下：基于全域漏斗分析的主搜深度统一粗排 91348
2 复杂链表的复制 90543
3 【Transform3D】转换详解（看完就会） 88069
4 Mysql优化高级篇（全） 76975
5 一文详解｜如何写出优雅的代码 119323
6 【flexbox弹性布局学习指南】CSS热门布局方案 68770
7 DCM：中间件家族迎来新成员 61110
8 图解KafkaConsumer SyncGroupRequest请求流程 52182
9 万字长文详解Java lambda表达式 51099
10 系统的混乱并业务本身之复杂，我们并不擅长处理『简单』 48252
11 超越10倍开发者 48104
12 ⚡Three.js-在场景中导入3D动画模型 46087
13 Request&Response 39070
14 《JavaScript高级程序设计》__ 作用域&内存 37878
15 如何实现一个自定义的starter 36575
16 影响成长的关键思考 34874
17 K8S学习-当我们部署应用的时候都发生了什么？（第一篇） 30647
18 小程序的框架以及响应的数据绑定 28866
19 【从零开始学习深度学习】12. 什么是模型的训练误差？基于三阶多项式的欠拟合与过拟合训练过程演示 27877
20 阿里云物联网平台设备分发实战 33483
1 2023阿里云学生服务器免费申请流程 62
2 YAML与Spring Boot 193
3 AI给你送年画啦！每一张都是独一无二 61
4 中原银行对金融行业实时数仓的现状与发展趋势思考 153
5 玖章算术CEO叶正盛：程序员必须掌握的数据库原理 111
6 万字长文 | 多目标跟踪最新综述（基于Transformer/图模型/检测和关联/孪生网络）（下） 57
7 Windows和Ubuntu双系统安装（非虚拟机） 135
8 2023跨年代码（烟花+自定义文字+背景音乐+雪花+倒计时） 781
9 【解决方案】成功解决ERROR: Could not build wheels for opencv-python, which is required to install pyproject.toml-based projects报错信息 81
10 Image Search-这是你的图像搜索 149
11 C/C++编程题之简单错误记录 70
12 启用了嵌套硬件辅助的虚拟化时，无法添加 PCI 直通设备。 52
13 学点Linux命令没坏处（文件压缩、解压） 66
14 Java学习笔记 131
15 Spring Cloud Alibaba 2022.0.0.0 版本发布啦！ 107
16 Disney 流媒体广告 Flink 的应用实践 92
17 VC++ 知识小结(续) 156
18 绝了，超越YOLOv7、v8,YOLOv6 v3.0正式发布！ 113
19 详解@RequestParam和@RequestBody 60
20 windows出现错误0x800401E5:没有供标记使用的对象 52
推荐文章
2022藏经阁年度电子书榜单出炉！ 参与应用引擎 SAE评测，赢取CHERRY机械键盘等好礼 “第益课”大学生技术公益 乘风者计划邀您入驻社区，精彩权益即刻享
相关电子书
更多
低代码开发师（初级）实战教程
立即下载
阿里巴巴DevOps 最佳实践手册
立即下载
冬季实战营第三期：MySQL数据库进阶实战
立即下载