Home > Web Front-end > JS Tutorial > Summary of JavaScript methods to obtain tr td

Summary of JavaScript methods to obtain tr td

巴扎黑
Release: 2017-08-17 15:59:47
Original
1931 people have browsed it

This article mainly introduces three ways to obtain tr td using JavaScript. You can check the detailed explanation below for the specific operation steps. Interested friends can refer to it.

                                                                                                                                                                                                                                     First get the table, then get the tr tag, and then traverse the 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){
//         $(&#39;#selectIds&#39;).val($(&#39;#selectIds&#39;).val() + "" + idtext); 
//       }else{
//         $(&#39;#selectIds&#39;).val($(&#39;#selectIds&#39;).val() + "," + idtext);
//       }
//       }
Copy after login


/* How to write jQuery, get tr and then traverse all td. Note that the value obtained by td is .text(); */


//   $(&#39;#selectIds&#39;).val("");
//   var isFirst = true;
//    $("#tb_table").find("tr").each(function(){
//      var tdArr = $(this).children();
//      var idtext = tdArr.eq(1).text();
//      if(idtext != &#39;人员ID&#39;){
//        if(isFirst){
//        $(&#39;#selectIds&#39;).val($(&#39;#selectIds&#39;).val() + "" + idtext); 
//        isFirst = false
//        }else{
//          $(&#39;#selectIds&#39;).val($(&#39;#selectIds&#39;).val() + "," + idtext);
//        }
//      console.log("idtext",idtext);
//      }
//    })
Copy after login

/* Native js gets all rows, and then gets each cell*/


//   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)
//   }
Copy after login

Summary:

$(this).children().eq( 1).text() gets the displayed value

$(this).children().eq(1).html() gets the value between All content

$('.trSelected',grid).find("td").eq(7).text(); obtains the content of a selected row

Settings Value: $('.trSelected',grid).find("td").eq(7).text(''Set content'')

xxx.innerHTML; is the value of the object obtained in js .

Traverse the table$("#grid tr").each(function() {
                                                                                               ().eq(1).text());
});

Use JavaScript to traverse


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);
    }
   }
  }
Copy after login

The above is the detailed content of Summary of JavaScript methods to obtain tr td. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template