Question

我今天在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个元素的列表。第一个代码块只是修复问题的黑客。

如果我将提醒更改为alert(row)，我会：

[object HTMLTableRowElement]
...

function item() {
    [native code]
}

21

function namedItem() {
    [native code]
}

Answer 1

for-in语句还列出了item返回的HTMLCollection上显示的namedItem和getElementsByTagName方法。

要对像DOM Collections这样的类数组元素迭代，总是建议使用简单的顺序循环，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用于类似数组的对象，因为：

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

Javascript getElementsByTagName打破了firefox？

1 个答案: