Question

使用Javascript，如何访问行中的特定子项？ Javascript（请不要jQuery）。

例如：<TD>的{{1}}，其中ID = id33322010100167

<TR>

Answer 1

var index = 1; // second element
var child = document.getElementById('id33322010100167').childNodes[index]

Answer 2

也许你可以试试这个：

var tRow = document.getElementById("tableName").getElementsByTagName("tr");

for(var i = 0; i < tRow.length; i++){
    if(tRow[i].id == "name of your id"){
        //do something
    }
}

Answer 3

最可靠的是cells集合，与非IE浏览器中的childNodes不同，它将忽略单元格之间的空白文本节点：

var td = document.getElementById("id33322010100167").cells[1];

Answer 4

我找到了结合两个评价最高的解决方案的方法：

除了使用childNodes之外，您还可以通过以下方式在此行下方获取类型为td的元素：

var array_td = document.getElementById('id33322010100167').getElementsByTagName("td");

要获取第一个td的内容，您可以使用：

array_td[1]

这样做的主要好处是，您不必在数组内部拥有所有不想处理的空白，并且如果添加了一些新的子项（不是tds），则不必更改索引。

Answer 5

使用DOM，您可以获取表格，然后在保持计数的同时迭代子元素。

当然，元素ID应该是唯一的，以便document.getElementById('id')起作用。

Answer 6

使用jQuery：

first = $('#id33322010100167 td:first'); // gives you the first td of the tr with id id33322010100167 
last = $('#id33322010100167 td:last'); // gives you the last td of the tr with id id33322010100167

你可以使用next（）迭代元素

first.next();

Answer 7

<table id="studTable" class="table table-bordered">
     <thead>
        <tr>
           <td>Click</td>
        </tr>
     </thead>
     <tbody>
           <tr><td><a href="#" onclick="ClickRow(this)">Click</a></td></tr>
     </tbody>
</table>

对于上表，您可以使用一些链接。您可以通过单击行内的行/单元格来读取所选行，并读取单元格值和/或从表格中删除行

function ClickRow(r) {
        console.log(r.parentNode.parentNode.cells[0].innerHTML); //Read First Cell in Row
        var i = r.parentNode.parentNode.rowIndex;
        document.getElementById("studTable").deleteRow(i); //Remove Row
    }

Javascript，如何访问一行中的特定子项？

7 个答案: