Перебор элементов в HTML-таблице

Question

Я учусь Javascript, в присвоении школе мы должны с помощью цикла сосчитать, сколько игр было сделано в 2014 г.

Она не возвращает ничего в консоли, где есть Я ошибся?

var allGames = document.getElementsByTagName('td'); 
 
var array = Array.prototype.slice.call(allGames, 0) 
 
var games14 = 0; 
 
for (var i = 0; i < array.length; ++i) { 
 
    if (array[i] == 2014) { 
 
    games14++; 
 
    console.log(games14) 
 
    } 
 
}

<table id="games"> 
 
    <thead> 
 
    <tr> 
 
     <th>Titel</th> 
 
     <th>Genre</th> 
 
     <th>Årstal</th> 
 
    </tr> 
 
    </thead> 
 
    <tbody id="games_tbody"> 
 
    <tr class="horror"> 
 
     <td class="title">Outlast</td> 
 
     <td>Horror</td> 
 
     <td>2013</td> 
 
    </tr> 
 
    <tr class="rpg"> 
 
     <td class="title">Dragon Age: Inquisition</td> 
 
     <td>Role-playing Game</td> 
 
     <td>2014</td> 
 
    </tr> 
 
    <tr class="rpg"> 
 
     <td class="title">Skyrim</td> 
 
     <td>Role-playing Game</td> 
 
     <td>2011</td> 
 
    </tr> 
 
    <tr class="horror"> 
 
     <td class="title">Amnesia: The Dark Descent</td> 
 
     <td>Horror</td> 
 
     <td>2010</td> 
 
    </tr> 
 
    <tr class="simulator"> 
 
     <td class="title">Scania Truck Driving Simulator</td> 
 
     <td>Simulator</td> 
 
     <td>2012</td> 
 
    </tr> 
 
    <tr class="horror"> 
 
     <td class="title">Five Nights at Freddy’s</td> 
 
     <td>Horror</td> 
 
     <td>2014</td> 
 
    </tr> 
 
    <tr class="simulator"> 
 
     <td class="title">Sims 4</td> 
 
     <td>Simulator</td> 
 
     <td>2014</td> 
 
    </tr> 
 
    <tr class="rts" id="last"> 
 
     <td class="title">Warcraft III: Reign of Chaos</td> 
 
     <td>Real-time Strategy</td> 
 
     <td>2002</td> 
 
    </tr> 
 
    </tbody> 
 
</table>

Answer 1

Вы должны проверить его текст:

var allGames = document.getElementsByTagName('td'); 
... 
if (array[i].innerHTML == '2014') { 

ИЛИ

if(array[i].innerText == '2014' || array[i].textContent == '2014'){ 

Answer 2

array[i] == 2014 

Все в массиве будет элементом элемента элемента данных таблицы HTML.

Ничто в массиве не будет номер 2014.

Вы должны прочитать текстовое содержимое из элемента, а затем сравните это.

Answer 3

Нет необходимости делать петлю через элементы в HTML-таблице .. Вы можете просто использовать regular expressions для подсчета всех вхождений в games_tbody:

var games14 = document 
 
    .getElementById('games_tbody') 
 
    .innerText 
 
    .match(/2014/g) 
 
    .length; 
 

 
console.log('Games made in 2014:', games14);

<table id="games"> 
 
    <thead> 
 
    <tr><th>Titel</th><th>Genre</th><th>Årstal</th></tr> 
 
    </thead> 
 
    <tbody id="games_tbody"> 
 
    <tr class="horror"><td class="title">Outlast</td><td>Horror</td><td>2013</td></tr> 
 
    <tr class="rpg"><td class="title">Dragon Age: Inquisition</td><td>Role-playing Game</td><td>2014</td></tr> 
 
    <tr class="rpg"><td class="title">Skyrim</td><td>Role-playing Game</td><td>2011</td></tr> 
 
    <tr class="horror"><td class="title">Amnesia: The Dark Descent</td><td>Horror</td><td>2010</td></tr> 
 
    <tr class="simulator"><td class="title">Scania Truck Driving Simulator</td><td>Simulator</td><td>2012</td></tr> 
 
    <tr class="horror"><td class="title">Five Nights at Freddy’s</td><td>Horror</td><td>2014</td></tr> 
 
    <tr class="simulator"><td class="title">Sims 4</td><td>Simulator</td><td>2014</td></tr> 
 
    <tr class="rts" id="last"><td class="title">Warcraft III: Reign of Chaos</td><td>Real-time Strategy</td><td>2002</td></tr> 
 
    </tbody> 
 
</table>

Answer 4

Я думаю, что это лучший способ ,

var table = document.getElementById("games"); 
count = 0; 
for (let i = 0; row = table.rows[i]; i++) { 
    if (row.cells[2].innerHTML === "2014"){ 
     count++; 
    } 
/* 
    for (let j = 0; col = row.cells[j]; j++) { 
     if (col.innerHTML === "2014"){ 
      count++; 
     } 
    } 
*/ 
} 
console.log(count); 

Прокомментированный код предназначен для проверки каждого элемента в одной строке.