迭代通過HTML表格返回未捕獲TypeError：未定義的'0'屬性

Question

我已經編寫了一個循環遍歷HTML表格中的每個單元格並匹配文本模式的函數'red.png'將jQuery方法應用於另一個元素在頁面上。

但是，在執行該功能時，我收到一個

"Uncaught TypeError: Cannot read property '0' of undefined"

我原本以爲這可能是由於在頁面執行DOM沒有被宣佈爲表，但通過輸出「表」測試這變量在console.log下面 - 我可以看到表格正確。

我的代碼如下：

function poll() { 
    var table = document.getElementById("myTable"); 
    //console.log(table); 
    for (var i = 0, cell; table.cells[i]; i++) { 
     if (cell[i].indexOf('red.png') != -1) { 
      $("#tenantPreviewLive").css('background-color', '#FF0000'); 
      $("#maximiseLive").css('background-color', '#FF0000'); 
     } 
    } 
} 

任何響應都感激！

Answer 1

你永遠不會在你的循環中設置cell。您可能打算在條件下（中間位）執行此操作。另外，您正試圖在元素上使用indexOf;你可能打算使用它的HTML：

function poll() { 
    var table = document.getElementById("myTable"); 
    //console.log(table); 
    for (var i = 0; cell = table.cells[i]; i++) { 
    //    ^^^^^^^ 
     if (cell.innerHTML.indexOf('red.png') != -1) { 
    //  ^^^^^^^^^^^^^^ 
      $("#tenantPreviewLive").css('background-color', '#FF0000'); 
      $("#maximiseLive").css('background-color', '#FF0000'); 
     } 
    } 
} 

我不建議使用這種形式的循環，但這是最小的改變。

雖然it doesn't look to me like table elements have a cells property。他們有rows，而這又有cells。所以這意味着兩個循環（table.rows之一和另一個循環的每一行cells）。

但是當你正在使用jQuery，你可以使用each：

function poll() { 
    $("#myTable td").each(function() { 
     if (this.innerHTML.indexOf('red.png') != -1) { 
      $("#tenantPreviewLive").css('background-color', '#FF0000'); 
      $("#maximiseLive").css('background-color', '#FF0000'); 
     } 
    }); 
} 

（即假設你沒有你的#myTable內的任何表。）

您還可能希望停止作爲第一個你會發現：

function poll() { 
    $("#myTable td").each(function() { 
     if (this.innerHTML.indexOf('red.png') != -1) { 
      $("#tenantPreviewLive").css('background-color', '#FF0000'); 
      $("#maximiseLive").css('background-color', '#FF0000'); 
      return false; // <==== Stops the `each` loop 
     } 
    }); 
} 

，甚至可能使用jQuery的:contains僞SE講師：

function poll() { 
    if ($("#myTable td:contains(red.png)").length > 0) { 
     $("#tenantPreviewLive").css('background-color', '#FF0000'); 
     $("#maximiseLive").css('background-color', '#FF0000'); 
    } 
}