Блог

Главная - Вопросы по программированию - функция ForEach для создания от одного tr до трех td и создания динамической таблицы

функция ForEach для создания от одного tr до трех td и создания динамической таблицы

#javascript #html

#javascript #HTML

Вопрос:

Мне нужно создать небольшой сайт, который получит несколько текстовых полей (‘Codigo’ ‘Nome’ ‘Documento’), помещенных в массив, который я уже сделал, и создать функцию ForEach для создания только от одного <tr> до трех <td> , я просто не понимаю, что я делаю плохо

 function atualizarTabela() {
    var tabelaBody = document.getElementById("corpo-tabela"); // corpo-tabela = tbody I need to clean it first

    tabelaBody.innerHTML = "";

    registros.forEach(function (registros) {  // registros is my array that content the three text boxes
        var createTr = document.createElement('tr');
        for (var i = 0; i < registros[i]; i  ) {
            var createTd = document.createElement("td");
            createTd.textContent = registro[i];
            createTr.appendChild(createTd);
        }
    });
}; 
 <body>

    <table id="clientes">
        <thead>
            <tr>
                <th>Codigo</th>
                <th>Nome</th>
                <th>Documento</th>
            </tr>
        </thead>
        <tbody id="corpo-tabela">
        </tbody>
    </table>
<div id="bloco-dados">
        <p>Código</p>
        <input type="text" id="txtCodigo" name="Código">
        <p>Nome</p>
        <input type="text" id="txtNome" name="Nome">
        <p>Documento</p>
        <input type="text" id="txtDocumento" name="Documento"><br>
        <input type="button" name="botao" id="btnSalvar" value="Salvar"><br>
        <input type="button" name="botao2" id="btnNovo" value="Novo">
    </div>


    <script src="script.js" type="text/javascript"></script>
</body>

Спасибо вам 🙂

Комментарии:

1. Так в чем проблема? Он ничего не показывает на сайте?

2. Да, bttn не может сконструировать <tr> и <td>

Ответ №1:

Попробуйте удалить пробел между функцией и аргументом и изменить аргумент на фиктивную переменную. Итак

 registros.forEach(function(r) {
  var createTr = document.createElement('tr');
  for (var i = 0; i < r.length; i  ) {
    let createTd = document.createElement("td");
    createTd.textContent = r[i];
    createTr.appendChild(createTd);
    tabelaBody.appendChild(createTr);
  }
});