Мне нужен код JavaScript, чтобы посчитать, сколько раз появляется первая буква из нескольких <td> - PullRequest
Новая
       13

Мне нужен код JavaScript, чтобы посчитать, сколько раз появляется первая буква из нескольких <td>

0 голосов
/ 18 января 2019

Я хочу посчитать, сколько раз моя команда выиграла или проиграла (V или D) в каждом соревновании (LSB или TUC или JUCS), а затем отобразить результаты, разделенные результатами И соревнованием, в другой таблице с идентификатором table_resultados_gerais.

Я так долго пытался выделить первое письмо, чтобы написать эту математику, но я не смог правильно выполнить то, что хотел, может кто-нибудь мне помочь? 

<html>

<body>

    <div id="div_resultados_gerais">
        <table id="table_resultados_gerais">
            <tbody>
                <thead>
                    <th colspan="3">Total</th>
                    <th colspan="3">JUCS</th>
                    <th colspan="3">LSB</th>
                    <th colspan="3">TUC</th>
                </thead>

                <tr>
                    <!-- TOTAL -->
                    <td class="d">10</td>
                    <td class="separador">-</td>
                    <td class="e">7</td>

                    <!-- JUCS -->
                    <td class="d">v</td>
                    <td class="separador">-</td>
                    <td class="e">d</td>

                    <!-- LSB -->
                    <td class="d">5</td>
                    <td class="separador">-</td>
                    <td class="e">6</td>

                    <!-- TUC -->
                    <td class="d">5</td>
                    <td class="separador">-</td>
                    <td class="e">1</td>
                </tr>

            </tbody>
        </table>
    </div>


    <div id="div_calendario_jogos">
        <table id="table_calendario_jogos">
            <tbody>
                <tr id="table_header">
                    <th>Date</th>
                    <th>Time</th>
                    <th>Season</th>
                    <th colspan="2">Oponente</th>
                    <th>Placar</th>
                    <th>Competition</th>
                </tr>
            </tbody>

            <tbody class="tbody_calendario_jogos">
                <tr>
                    <td>11/03/2018</td>
                    <td>15:00h</td>
                    <td>Regular</td>
                    <td>BMC</td>
                    <td>V, 52-42</td>
                    <td>LSB</td>
                </tr>

                <tr>
                    <td>08/04/2018</td>
                    <td>12:30h</td>
                    <td>Regular</td>
                    <td>Drink Team</td>
                    <td>D, 59-61</td>
                    <td>LSB</td>
                </tr>

                <tr>
                    <td>22/04/2018</td>
                    <td>10:30h</td>
                    <td>Regular</td>
                    <td>Nitcheroy Ballers</td>
                    <td>V, 53-40</td>
                    <td>TUC</td>
                </tr>

                <tr>
                    <td>28/04/2018</td>
                    <td>12:00h</td>
                    <td>Regular</td>
                    <td>Nacional</td>
                    <td>V, 50-34</td>
                    <td>LSB</td>
                </tr>

                <tr>
                    <td>06/05/2018</td>
                    <td>14:00h</td>
                    <td>Regular</td>
                    <td>VR Ballers</td>
                    <td>D, 45-74</td>
                    <td>LSB</td>
                </tr>


                <tr>
                    <td>11/03/2018</td>
                    <td>15:00h</td>
                    <td>Regular</td>
                    <td>BMC</td>
                    <td>V, 52-42</td>
                    <td>TUC</td>
                </tr>

                <tr>
                    <td>08/04/2018</td>
                    <td>12:30h</td>
                    <td>Regular</td>
                    <td>Drink Team</td>
                    <td>D, 59-61</td>
                    <td>LSB</td>
                </tr>

                <tr>
                    <td>22/04/2018</td>
                    <td>10:30h</td>
                    <td>Regular</td>
                    <td>Nitcheroy Ballers</td>
                    <td>V, 53-40</td>
                    <td>TUC</td>
                </tr>

                <tr>
                    <td>28/04/2018</td>
                    <td>12:00h</td>
                    <td>Regular</td>
                    <td>Nacional</td>
                    <td>V, 50-34</td>
                    <td>JUCS</td>
                </tr>

                <tr>
                    <td>06/05/2018</td>
                    <td>14:00h</td>
                    <td>Regular</td>
                    <td>VR Ballers</td>
                    <td>D, 45-74</td>
                    <td>JUCS</td>
                </tr>
            </tbody>
        </table>
    </div>
</body>

</html>

Ответы [ 2 ]

0 голосов
/ 18 января 2019

Предполагая, что вы ожидаете такой результат 

{
    "LSB": {
        "V": 2,
        "D": 3
    },
    "TUC": {
        "V": 3
    },
    "JUCS": {
        "V": 1,
        "D": 1
    }
}

Который вы позже превратите в стол

Вы можете попробовать следующее 

const table = document.querySelector('#table_calendario_jogos');
    const rows = [...table.tBodies[0].rows];
    const dataset = rows.map(row => {
        const cells = [...row.cells];
        const object = {};

        object.placar = cells[4].textContent[0];
        object.competition = cells[5].textContent;

        return object
    });

    const result = dataset.reduce((accumulator, currentValue, index, array) => {
        if (!accumulator[currentValue.competition]) {
            accumulator[currentValue.competition] = array
                .filter(item => item.competition === currentValue.competition)
                .map(item => item.placar)
                .reduce((acc, val) => {
                    if (!acc[val]) {
                        acc[val] = 1;
                    } else {
                        acc[val] = acc[val] + 1;
                    }

                    return acc;
                }, {});
        }

        return accumulator;
    }, {});

    console.log(result);

    // Render result table
    const t = document.createElement('table');
    const thead = document.createElement('thead');
    const tbody = document.createElement('tbody');
    const th1 = document.createElement('th');
    const th2 = document.createElement('th');
    const th3 = document.createElement('th');

    th1.textContent = 'Placar';
    th2.textContent = 'V';
    th3.textContent = 'D';

    thead.appendChild(th1);
    thead.appendChild(th2);
    thead.appendChild(th3);

    t.appendChild(thead);

    for (const key in result) {
        const tr = document.createElement('tr');
        const td1 = document.createElement('td');
        const td2 = document.createElement('td');
        const td3 = document.createElement('td');

        td1.textContent = key;
        td2.textContent = result[key].V;
        td3.textContent = result[key].D;

        tr.appendChild(td1);
        tr.appendChild(td2);
        tr.appendChild(td3);

        tbody.appendChild(tr)

        t.appendChild(tbody);
    }

document.querySelector('#result').appendChild(t);
<div id="div_resultados_gerais">
    <table id="table_resultados_gerais">
        <tbody>
            <thead>
                <th colspan="3">Total</th>
                <th colspan="3">JUCS</th>
                <th colspan="3">LSB</th>
                <th colspan="3">TUC</th>
            </thead>

            <tr>
                <!-- TOTAL -->
                <td class="d">10</td>
                <td class="separador">-</td>
                <td class="e">7</td>

                <!-- JUCS -->
                <td class="d">v</td>
                <td class="separador">-</td>
                <td class="e">d</td>

                <!-- LSB -->
                <td class="d">5</td>
                <td class="separador">-</td>
                <td class="e">6</td>

                <!-- TUC -->
                <td class="d">5</td>
                <td class="separador">-</td>
                <td class="e">1</td>
            </tr>

        </tbody>
    </table>
</div>

<div id="result"></div>

<div id="div_calendario_jogos">
    <table id="table_calendario_jogos">
        <thead>
            <tr id="table_header">
                <th>Date</th>
                <th>Time</th>
                <th>Season</th>
                <th colspan="2">Oponente</th>
                <th>Placar</th>
                <th>Competition</th>
            </tr>
        </thead>

        <tbody class="tbody_calendario_jogos">
            <tr>
                <td>11/03/2018</td>
                <td>15:00h</td>
                <td>Regular</td>
                <td>BMC</td>
                <td>V, 52-42</td>
                <td>LSB</td>
            </tr>

            <tr>
                <td>08/04/2018</td>
                <td>12:30h</td>
                <td>Regular</td>
                <td>Drink Team</td>
                <td>D, 59-61</td>
                <td>LSB</td>
            </tr>

            <tr>
                <td>22/04/2018</td>
                <td>10:30h</td>
                <td>Regular</td>
                <td>Nitcheroy Ballers</td>
                <td>V, 53-40</td>
                <td>TUC</td>
            </tr>

            <tr>
                <td>28/04/2018</td>
                <td>12:00h</td>
                <td>Regular</td>
                <td>Nacional</td>
                <td>V, 50-34</td>
                <td>LSB</td>
            </tr>

            <tr>
                <td>06/05/2018</td>
                <td>14:00h</td>
                <td>Regular</td>
                <td>VR Ballers</td>
                <td>D, 45-74</td>
                <td>LSB</td>
            </tr>


            <tr>
                <td>11/03/2018</td>
                <td>15:00h</td>
                <td>Regular</td>
                <td>BMC</td>
                <td>V, 52-42</td>
                <td>TUC</td>
            </tr>

            <tr>
                <td>08/04/2018</td>
                <td>12:30h</td>
                <td>Regular</td>
                <td>Drink Team</td>
                <td>D, 59-61</td>
                <td>LSB</td>
            </tr>

            <tr>
                <td>22/04/2018</td>
                <td>10:30h</td>
                <td>Regular</td>
                <td>Nitcheroy Ballers</td>
                <td>V, 53-40</td>
                <td>TUC</td>
            </tr>

            <tr>
                <td>28/04/2018</td>
                <td>12:00h</td>
                <td>Regular</td>
                <td>Nacional</td>
                <td>V, 50-34</td>
                <td>JUCS</td>
            </tr>

            <tr>
                <td>06/05/2018</td>
                <td>14:00h</td>
                <td>Regular</td>
                <td>VR Ballers</td>
                <td>D, 45-74</td>
                <td>JUCS</td>
            </tr>
        </tbody>
    </table>
</div>
0 голосов
/ 18 января 2019

Как то так? 

var res = {
  "JUCS": {
    "V": 0,
    "D": 0
  },

  "LSB": {
    "V": 0,
    "D": 0
  },
  "TUC": {
    "V": 0,
    "D": 0
  },
}
document.querySelectorAll("table td:nth-of-type(5)").forEach(function(cell) {
  var text = cell.textContent;
  var vd = text.split(",")[0];
  var team = cell.nextElementSibling.textContent;
  if ("VD".indexOf(vd) > -1) res[team][vd]++
});
var v=0, d=0;
for (team in res) {
  var V = res[team]["V"], D = res[team]["D"];
  v += V
  d += D
  document.getElementById(team+"_V").textContent = V;
  document.getElementById(team+"_D").textContent = D;
}
document.getElementById("total_V").textContent = v;
document.getElementById("total_D").textContent = d;
<div id="div_resultados_gerais">
  <table id="table_resultados_gerais">
    <thead>
      <th colspan="3">Total</th>
      <th colspan="3">JUCS</th>
      <th colspan="3">LSB</th>
      <th colspan="3">TUC</th>
    </thead>
    <tbody id="tb">
      <tr>
        <!-- TOTAL -->
        <td id="total_V" class="d">10</td>
        <td class="separador">-</td>
        <td id="total_D" class="e">7</td>

        <!-- JUCS -->
        <td id="JUCS_V" class="d">v</td>
        <td class="separador">-</td>
        <td id="JUCS_D" class="e">d</td>

        <!-- LSB -->
        <td id="LSB_V" class="d">5</td>
        <td class="separador">-</td>
        <td id="LSB_D" class="e">6</td>

        <!-- TUC -->
        <td id="TUC_V" class="d">5</td>
        <td class="separador">-</td>
        <td id="TUC_D" class="e">1</td>
      </tr>

    </tbody>
  </table>
</div>


<div id="div_calendario_jogos">
  <table id="table_calendario_jogos">
    <tbody>
      <tr id="table_header">
        <th>Date</th>
        <th>Time</th>
        <th>Season</th>
        <th colspan="2">Oponente</th>
        <th>Placar</th>
        <th>Competition</th>
      </tr>
    </tbody>

    <tbody class="tbody_calendario_jogos">
      <tr>
        <td>11/03/2018</td>
        <td>15:00h</td>
        <td>Regular</td>
        <td>BMC</td>
        <td>V, 52-42</td>
        <td>LSB</td>
      </tr>

      <tr>
        <td>08/04/2018</td>
        <td>12:30h</td>
        <td>Regular</td>
        <td>Drink Team</td>
        <td>D, 59-61</td>
        <td>LSB</td>
      </tr>

      <tr>
        <td>22/04/2018</td>
        <td>10:30h</td>
        <td>Regular</td>
        <td>Nitcheroy Ballers</td>
        <td>V, 53-40</td>
        <td>TUC</td>
      </tr>

      <tr>
        <td>28/04/2018</td>
        <td>12:00h</td>
        <td>Regular</td>
        <td>Nacional</td>
        <td>V, 50-34</td>
        <td>LSB</td>
      </tr>

      <tr>
        <td>06/05/2018</td>
        <td>14:00h</td>
        <td>Regular</td>
        <td>VR Ballers</td>
        <td>D, 45-74</td>
        <td>LSB</td>
      </tr>


      <tr>
        <td>11/03/2018</td>
        <td>15:00h</td>
        <td>Regular</td>
        <td>BMC</td>
        <td>V, 52-42</td>
        <td>TUC</td>
      </tr>

      <tr>
        <td>08/04/2018</td>
        <td>12:30h</td>
        <td>Regular</td>
        <td>Drink Team</td>
        <td>D, 59-61</td>
        <td>LSB</td>
      </tr>

      <tr>
        <td>22/04/2018</td>
        <td>10:30h</td>
        <td>Regular</td>
        <td>Nitcheroy Ballers</td>
        <td>V, 53-40</td>
        <td>TUC</td>
      </tr>

      <tr>
        <td>28/04/2018</td>
        <td>12:00h</td>
        <td>Regular</td>
        <td>Nacional</td>
        <td>V, 50-34</td>
        <td>JUCS</td>
      </tr>

      <tr>
        <td>06/05/2018</td>
        <td>14:00h</td>
        <td>Regular</td>
        <td>VR Ballers</td>
        <td>D, 45-74</td>
        <td>JUCS</td>
      </tr>
    </tbody>
  </table>
</div>
...