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

问题描述：

我创建使用JavaScript的HTML表：如何从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);

但我没有得到任何结果。即使警报框不显示。

如何获取不含标题行的表变量内的行？

凡被称为用警惕的代码？无论如何，使用像AngularJs或knockoutJs这样的框架会更好。 – Max 2014-11-24 10:31:58

因为您的表格尚未在DOM中创建。没有框架，你只能一个一个地创建DOM元素。 – DontVoteMeDown 2014-11-24 10:34:24

答

使用Javascript

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

使用Javascript另一种解决方案：

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

使用jQuery：

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

答

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

答

我使用insertAdjacentHTML解析字符串，HTML DOM

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

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

相关推荐