Generate a table using String and innerHTML template

Asked

Viewed 77 times

0

In one exercise, I was trying to create a table through DOM using template string and the innerHTML command

Where I want to insert the td

<tr id="boletinAluno">

</tr>

Creating the student

function cadastrarAluno(e){

    let nome = document.querySelector('#nome').value
    let nota1 = document.querySelector('#nota1').value
    let nota2 = document.querySelector('#nota2').value
    let nota3 = document.querySelector('#nota3').value

    let aluno = new Aluno(nome,nota1,nota2,nota3)

    montarLinha(aluno);



}

Montarlinha

function montarLinha(aluno){
        let content = `
        <td>${aluno.nome}</td>
        <td>${aluno.nota1}</td>
        <td>${aluno.nota2}</td>
        <td>${aluno.nota3}</td>
        <td>${aluno.getMedia}</td>

        `
       boletin = document.querySelector('#boletinAluno').innerHTML+=content;


    }

ERROR

index.html:89 Uncaught TypeError: Cannot read property 'innerHTML' of null
    at montarLinha (index.html:89)
    at cadastrarAluno (index.html:75)
    at HTMLInputElement.onclick (index.html:39)
montarLinha @ index.html:89
cadastrarAluno @ index.html:75
onclick @ index.html:39
  • document.querySelector('#boletinAluno') is returning null, checks if your function is not before the HTML that creates this element.

  • The script is created after the creation of the TR, ie is not the problem.

No answers

Browser other questions tagged

You are not signed in. Login or sign up in order to post.