Question

我正在使用JavaScript创建HTML表格：

function CreateArray(){
  var arr = [];
  for(var i = 0 ; i < 10; i++){    
    arr.push({
      firstName:"John",
      lastName:"Doe",
      email:"email"+i.toString()+"@gmail.com"
    }); 
  } 
  return arr;
}

function CreateTable(data) {   
  var tableStr = [];
  var j = -1;

  tableStr[++j] = '<table class="tftable" border="1"><thead><tr><th><input type="checkbox" id="allEmails" onclick = "SelectAllEmails()"/></th><th>First Name</th><th>Family Name</th><th>Email</th></tr></thead><tbody>';

  for (var i = 0; i < data.length; i++) {
    tableStr[++j] = '<tr><td>';
    tableStr[++j] = '<input type= "checkbox"';
    tableStr[++j] = 'id =' + "chbxEmail" + i.toString() +" "+'onclick =' + "foo(this)"+" "+'/>';
    tableStr[++j] = '</td><td>';
    tableStr[++j] =  data[i].firstName;
    tableStr[++j] = '</td><td>';
    tableStr[++j] = data[i].lastName;
    tableStr[++j] = '</td><td>';
    tableStr[++j] = data[i].email;
    tableStr[++j] = '</td></tr>';
  }
  tableStr[++j] = '</tbody></table>';
  var table = tableStr.join('');
}

我需要获取HTML表格中除标题行之外的所有行。我已经这样试过了：

var trows =  table.getElementsByTagName('tbody')[0].rows;
alert(trows.length);

但我没有得到任何结果。即使是警告框也不会显示。

如何在没有标题行的情况下获取表变量中的行？

Answer 1

使用Javascript：

document.querySelectorAll('#table-id tr:not(:first-child)')

使用Javascript的另一种解决方案：

document.getElementById('table-id').children[1].children

使用JQuery：

$('#table-id tr:not(:first-child)')

Answer 2

问题是，您可能没有将表插入HTML DOM。否则它应该工作。您也可以考虑使用querySelector函数代替getElementsByTagName，例如var rows = document.querySelector('tbody tr');

Answer 3

我使用insertAdjacentHTML将字符串解析为HTML DOM

https://developer.mozilla.org/en-US/docs/Web/API/Element.insertAdjacentHTML

如何从动态创建的HTML字符串表中获取行？

3 个答案: