获取tr td 的三种方式

简介:


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
         /* 第一种,原生的js,先获取table然后获取tr标签,然后遍历td */
//          $('#selectIds').val("");
//           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;
//              var idtext = id[1].innerHTML;
//              if(i == 1){
//                  $('#selectIds').val($('#selectIds').val() + "" + idtext); 
//              }else{
//                  $('#selectIds').val($('#selectIds').val() + "," + idtext);
//              }
//             }
 
    /* jQuery的写法,获取到tr然后遍历所有的td。注意td获取值是.text(); */
//      $('#selectIds').val("");
//      var isFirst = true;
//        $("#tb_table").find("tr").each(function(){
//           var tdArr = $(this).children();
//           var idtext = tdArr.eq(1).text();
//           if(idtext != '人员ID'){
//               if(isFirst){
//                $('#selectIds').val($('#selectIds').val() + "" + idtext); 
//               isFirst = false
//               }else{
//                   $('#selectIds').val($('#selectIds').val() + "," + idtext);
//               }
//           console.log("idtext",idtext);
//           }
//       })
 
     /* 原生js获取所有行,再获取每个单元格 */
//     var table = document.getElementById("tb_table");
//     var rows = table.rows;//获取所有行
//     console.log("lenth",rows.length) //
//     for(var i=1; i < rows.length; i++){
//         var row = rows[i];//获取每一行
//         var id = row.cells[1].innerHTML;//获取具体单元格
//         console.log("id",id)
//     }


总结:


$(this).children().eq(1).text()获取的是显示的值
$(this).children().eq(1).html()获取的是<td></td>之间的所有内容
$('.trSelected',grid).find("td").eq(7).text();获取的是选中的某行的内容

设置值:$('.trSelected',grid).find("td").eq(7).text(‘’设置内容‘’)

xxx.innerHTML; 是js里面获取对象的值。

 

遍历表<table id="gird".....

$("#grid tr").each(function() {
             alert($(this).children().eq(1).text());
 });

 

JavaScript来遍历

function load(){
     var tab=document.getElementById("grid");
     var rows=tab.rows;
     alert(rows.length);
     for(var i=0;i<rows.length;i++)
     {
        for(var j=0;j<rows[i].cells.length;j++)
        {
       alert("第"+(i+1)+"行,第"+(j+1)+"列的值是:"+rows[i].cells[j].innerHTML);
        }
     }
   }





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



相关文章
|
3月前
HTML中tr、th和td
HTML中tr、th和td
|
6月前
|
前端开发
前端第二课,HTML,alt,title,width/heigh,border,<a>超链接,target,tr,td,th
前端第二课,HTML,alt,title,width/heigh,border,<a>超链接,target,tr,td,th
|
JavaScript
循环遍历获取table中的td,tr
html中获取table的td,tr数据
340 0
td标签不用tr强制换行
废话不多说,直接上代码。
168 0
td标签不用tr强制换行
|
JavaScript
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()+"。
3081 0
|
JavaScript 前端开发 索引
JavaScript 技术篇-js获取表格元素tr、th、td相对于父节点的索引。
JavaScript 技术篇-js获取表格元素tr、th、td相对于父节点的索引。
697 0
JavaScript 技术篇-js获取表格元素tr、th、td相对于父节点的索引。
|
关系型数据库 运维 MySQL