2D-массив с getElementsByTagName?

Question

Я пытаюсь получить доступ к ячейкам таблицы в javascript, используя метод getElementsByTagName, как показано ниже. В конечном счете, я хочу сравнить каждую ячейку в массиве с другим значением и иметь возможность изменить цвет фона этой ячейки в соответствии со сравнением.

var cells = document.getElementById("myTable").getElementsByTagName("tr"); 
for (i = 0; i < cells.length; i++) 
{ 
    cells[i] = cells[i].getElementsByTagName("td"); 
} 

Однако, если я попытаюсь получить доступ к ячейкам [0] [0], он вернется не определен. Я чувствую, что я не совсем понимаю, что делает getElementsByTagName ... есть ли надежда на этот метод? Есть ли более эффективный?

Answer 1

использование JQuery будет просто:

var contentArray = new Array(); 



$('tr').each(function(indexParent) { 
    contentArray['row'+indexParent] = new Array(); 
    $(this).children().each(function(indexChild) { 
     contentArray['row'+indexParent]['col'+indexChild] = $(this).html(); 
    }); 
}); 

Answer 2

Вам нужно сделать что-то вроде этого для каждой строки.

var row = table.getElementsByTagName('tr')[rowIndex]; 
var cells = row.getElementsByTagName('td'); 

затем построить свой массив из содержимого этих переменных.

Answer 3

Используйте это, чтобы получить ячейки таблицы как 2D массива

var tableRows = (document.getElementById("myTable")).getElementsByTagName("tr"); 

var cells = []; 
for(var i = 0; i < tableRows.length; i++) { 
    cells.push(tableRows[i].getElementsByTagName("td")); 
} 

И теперь вы можете получить любую ячейку на вашем столе с помощью

cells[0][0] 

Answer 4

Вы можете получить доступ к любой ячейке непосредственно с помощью таблицы элемента .rows имущество и элемент tr элемента .cells:

var myCell = myTable.rows[y].cells[x]; 

Не нужно создавать собственный массив.

Поэтому не используйте .getElementsByTagName(), который возвращает одномерный массив. (Ну, на самом деле NodeList, но вы можете использовать его как массив до тех пор, как вы помните, что это живого.)

Если вы действительно хотели, чтобы перебрать все клетки, чтобы сравнить их с каким-то другим значением здесь, как , слева направо, сверху вниз, используя .rows и .cells:

var rows = document.getElementById("myTable").rows; 
for (var y=0; y < rows.length; y++) { 
    for (var x=0; x < rows[y].length; x++) { 
     var cellAtXY = rows[y].cells[x]; 
     cellAtXY.someProperty = something; // your code here 
    } 
}