Question

我正在使用insertRow将TR元素插入到表中，但由于某种原因，当我对其执行nextSibling时，它不会将插入的TR元素计为其他元素的兄弟。

例如，请考虑下表。

<table id="myTable">
    <tr id="row_0">
        <td colspan="3">Row 1</td>
    </tr>
    <tr id="tr_0_0">
        <td>Option 1</td>
        <td>Option2</td>
        <td>Option 3</td>
    </tr>
    <tr id="tr_0_1">
        <td>Option 1</td>
        <td>Option 2</td>
        <td>Option 3</td>
    </tr>
</table>

所以在我这样做之后：

var lTable = document.getElementById("myTable");
var trEle = lTable.insertRow(-1);
trEle.id = "tr_0_2";

var cell1 = trEle.insertCell(0);
cell1.innerHTML = "Option 1";

var cell2 = trEle.insertCell(1);
cell2.innerHTML = "Option 2";

var cell3 = trEle.insertCell(-1);
cell3.innerHTML = "Option 3";

然后我使用这种方法来获取所有的兄弟姐妹，但它从来没有给我这里的最后一个兄弟，但是只有它是通过insertRow添加的，因为它让所有的nextSiblings都很好，但是一旦我添加兄弟insertRow它永远不会给我最后的兄弟姐妹，argggg ....

var tempTr = document.getElementById("row_0");
var totalSibs = 0;

while(tempTr.nextSibling != null)
{

    var tempId = tempTr.id;

    // If no id, not an element, or not a tr_0 id.
    if (!tempId || tempTr.nodeType != 1 || tempId.indexOf("tr_0") != 0)
    {
        tempTr = tempTr.nextSibling;
        continue;
    }

    // This NEVER ALERTS the last id of the row that was inserted using insertRow, arggg.
    alert(tempId);

    totalSibs++;

    tempTr = tempTr.nextSibling;
}

所以，totalSibs应该返回3，因为在我插入行之后，应该有3个兄弟姐妹，但是返回2并且从不计算第3个兄弟姐妹.... arggg。

有人可以帮我吗？

Answer 1

问题是在最后一次迭代中，您将tempTr设置为下一个兄弟（实际上是最后一个tr），但是再次检查您的nextSibling while条件，在最后一种情况下它将是null，完成循环。

将您的while条件更改为：

while (tempTr != null) {
  //...
}

或者简单地说：

while (tempTr) {
  //...
}

尝试使用代码here。

nextSibling问题与表

1 个答案: