Как добавить строки таблицы в существующую таблицу в HTML, используя JavaScript без insertRow? - PullRequest
1 голос
/ 05 октября 2019

У меня есть задание, в котором, если я передаю массив 0 в функцию, мне нужно добавить только одну строку в существующую таблицу. Однако, когда я запускаю свой код через проверку присваивания, он постоянно говорит, что я делаю две строки. В результате я продолжаю проваливать юнит-тест.

В назначении также отмечается, что я не могу использовать insertCell и / или insertRow, так как это вызывает проблему с автогрейдером.

Мой подход к этой проблеме заключается в том, что если сумма массива равна 0, получить существующую таблицу с идентификатором distributionTable и добавить к ней одну строку. Я использовал инструмент проверки браузера для отладки, чтобы убедиться, что в HTML присутствует одна строка.

Ниже приведена функция, которую я создал в JavaScript:

function setTableContent(userInput) {
    let gradeArray = parseScores(userInput);
    let distArray = buildDistributionArray(gradeArray);
    let sum = 0

    for (let i = 0; i < distArray.length; i++) {
        sum = sum + distArray[i];
    }

    if (sum <= 0) {
        var table = document.getElementById("distributionTable")
        row = table.appendChild(document.createElement("tr"));
    } 
}

Ниже приведена HTML-страница, которая будет изменена из JavaScript:

<!DOCTYPE html>
<html>
    <head>
        <style>
            .bar0 { vertical-align: bottom; background-color: #00C000; }
            .bar1 { vertical‐align: bottom; background-color: #309000; }
            .bar2 { vertical‐align: bottom; background-color: #606000; }
            .bar3 { vertical‐align: bottom; background-color: #903000; }
            .bar4 { vertical‐align: bottom; background-color: #C00000; }
            td { vertical-align: bottom }
        </style>
        <script src="index.js"></script>
    </head>
    <body onload="bodyLoaded()">
        <table style="border: 2px solid black" id="distributionTable">
        </table>
    </body>
</html>

Ниже приведенаЭлементы HTML в моем браузере после запуска кода: HTML Inspect Code

Вот вывод из модульного теста: Unit Test Result

Пожалуйстадайте мне знать, если у вас есть какие-либо вопросы или предложения. Спасибо!

1 Ответ

1 голос
/ 05 октября 2019

Автогрейдер, похоже, в замешательстве.

Я готов поспорить, что грейдер проверяет table.childNodes.length вместо table.children.length.

Он должен проверять только дочерние, а не дочерние узлы.

Редактировать: И чтобы выполнить задание (пока они исправляют грейдер), вы можете просто сделать следующее

table.innerHTML = "";
table.appendChild(document.createElement('tr'));
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...