3

我今天在 Firefox 中遇到了最奇怪的 Javascript 问题。

我正在尝试操作一些表格行，但.getElementsByTagName("tr");正在拉回垃圾。

dynamicTable.tableBody = dynamicTable.getElementsByTagName("tbody")[0];
var tableRows = dynamicTable.tableBody.getElementsByTagName("TR");
var actualTableRows = new Array();
for(var i in tableRows) {
    var row = tableRows[i];
    alert(row.tagName);
    if(row.tagName == "TR"){
       actualTableRows.push(row);
    }
}
dynamicTable.bodyRows = actualTableRows;

令人费解的部分当然是我修复错误的临时技巧。出于某种原因.getElementsByTagName("tr")，也撤回了一些功能。

顺便说一句，上面的警报类似于“TR TR TR TR undefined undefined undefined”。

我想要的代码是这样的

dynamicTable.bodyRows = dynamicTable.tableBody.getElementsByTagName("tr");

但是，它bodyrows不仅包含<tr>元素，还包含上述垃圾。

有什么想法吗？

编辑：如果我只使用第二个代码块，我会在一个有 21 个表行（tr 元素）的表上得到一个 24 个元素长的列表。第一个代码块只是解决问题的 hack。

如果我将警报更改为alert(row)我得到：

[object HTMLTableRowElement]
...

function item() {
    [native code]
}

21

function namedItem() {
    [native code]
}
4

1 回答 1

8

该for-in语句还枚举返回的HTMLCollection上的item和namedItem方法。getElementsByTagName

要遍历DOM 集合之类的类数组元素，始终建议使用简单的顺序循环，该for...in语句旨在用于枚举对象属性。

dynamicTable.tableBody = dynamicTable.getElementsByTagName("tbody")[0];
var tableRows = dynamicTable.tableBody.getElementsByTagName("TR");
var actualTableRows = new Array();
for(var i = 0, n = tableRows.length; i < n; i++) { // <---- simple for loop
    var row = tableRows[i];
    alert(row.tagName);
    if(row.tagName == "TR"){
       actualTableRows.push(row);
    }
}
dynamicTable.bodyRows = actualTableRows;

您不应该使用for..in类似数组的对象，因为：

  • 不保证迭代的顺序，数组索引可能不会按数字顺序访问。
  • 还枚举了继承的属性（这可能是另一个问题来源）。

推荐文章：

于 2010-06-16T18:41:57.740 回答