Javascript选择元素

Question

如何通过了解列索引来从表列中选择所有复选框？

LE：这需要在普通的JavaScript来加以解决，而不是jQuery的

Answer 1

使用第n个孩子选择！ http://api.jquery.com/nth-child-selector/

Answer 2

假设没有colspans或rowspans，那么你可以用jQuery做到这一点相当简单：

$('#mytable tr td:nth-child('+index+') input[type="checkbox"]'); 

@Dustin莱恩加好点：第n个孩子索引开始于1，不是0

Answer 3

如果你打算用普通的javascript来做到这一点，我会建议在每个复选框中添加一个类名来将它与表列相关联。所以，你的表会是这个样子：

<table id="mytable"> 
     <tr> 
       <td><input type="checkbox" class="column-1" name="a"></td> 
       <td><input type="checkbox" class="column-2" name="b"></td> 
       <td><input type="checkbox" class="column-3" name="c"></td> 
     <tr> 
     <tr> 
       <td><input type="checkbox" class="column-1" name="d"></td> 
       <td><input type="checkbox" class="column-2" name="e"></td> 
       <td><input type="checkbox" class="column-3" name="f"></td> 
     <tr> 
     <tr> 
       <td><input type="checkbox" class="column-1" name="g"></td> 
       <td><input type="checkbox" class="column-2" name="h"></td> 
       <td><input type="checkbox" class="column-3" name="i"></td> 
     <tr> 
</table> 

然后，你可以选择所有的复选框，在这样的柱：

document.getElementsByClassName('column-'+index) 

Answer 4

要做到这一点，最简单的办法是，为李本推荐，设置一个id属性，您可以在表格元素本身轻松找到它。然后，您可以使用下面的方法找到你的表：

var myTable = document.getElementById("<idattributevalue>"); 

现在我们必须通过所有有问题的列索引行的迭代（我们就叫它“myIndex”），我们现在有一个函数我们可以用它来找到你所有的复选框：

function findMyCheckboxes(myTable, myIndex) { 

    var myCheckboxes = []; 
    var cell = null; 
    var allInputs = null; 

    var myRows = myTable.rows; 

    for (var i = 0; i < myRows.length; i++) { 
    // Get the cell for each row at the index we know 
    cell = myRows[i].cells[myIndex]; 
    // Get all input tags in that cell 
    allInputs = cell.getElementsByTagName("input"); 
    // Only pick the inputs which are checkboxes 
    for (var j = 0; j < allInputs.length; j++) { 
     if (allInputs[j].type == "checkbox") { 
     myCheckboxes.push(allInputs[j]); 
     } 
    } 
    } 

    return(myCheckboxes); 

} 

这段代码当然可能有一些语法错误。随意指出。

Answer 5

像这样简单的东西可能会工作，具体取决于您的表结构。

var colIndex = 1; // 0-based 
var table = document.getElementById('mytable'); 
var numRows = table.getElementsByTagName('tr').length; 
for (var i=0; i<numRows; i++) 
{ 
var box = table.getElementsByTagName('tr')[i].getElementsByTagName('td')[colIndex].getElementsByTagName("input")[0]; 
box.setAttribute("checked", "true"); 
}