Home / Questions / 457029
Accepted
Pedro
Asked: 2022-06-03 14:20:29 +0800 CST 2022-06-03 14:20:29 +0800 CST

Render with the html.inner method

  • 772

When trying to render the following code in an html document, it fails

let objDos = {
    Dental: [
      {
          HORA: "8:30",
          ESPECIALISTA: "ANDREA ZUÑIGA",
          PACIENTE: "MARCELA RETAMAL",
          RUT: "11123425-6",
          PREVISION: "ISAPRE"
      },
      {
          HORA: "11:00",
          ESPECIALISTA: "MARIA PIA ZAÑARTU",
          PACIENTE: "ANGEL MUÑOZ",
          RUT: "9878789-2",
          PREVISION: "ISAPRE"
      },
      {
          HORA: "11:30",
          ESPECIALISTA: "SCARLETT WITTING",
          PACIENTE: "MARIO KAST",
          RUT: "7998789-5",
          PREVISION: "FONASA"
      },
      {
          HORA: "13:00",
          ESPECIALISTA: "FRANCISCO VON TEUBER",
          PACIENTE: "KARIN FERNANDEZ",
          RUT: "18887662-K",
          PREVISION: "FONASA"
      },
      {
          HORA: "13:30",
          ESPECIALISTA: "EDUARDO VIÑUELA",
          PACIENTE: "HUGO SANCHEZ",
          RUT: "17665461-4",
          PREVISION: "FONASA"
      },
      {
          HORA: "14:00",
          ESPECIALISTA: "RAQUEL VILLASECA",
          PACIENTE: "ANA SEPULVEDA",
          RUT: "14441281-0",
          PREVISION: "ISAPRE"
      }
    ]
    }
    let clientes = objDos.Dental;
for(item of clientes){
   let text = `<p>${item.HORA}, ${item.ESPECIALISTA}, ${item.PACIENTE}</p>`
   let  consultas
    consultas.push(text);
   document.getElementById("consultantes").innerHTML+=text;
}

Of course, in the html document I have a div with an identifier "consultants". What I don't understand is why it doesn't render or display in the browser. The console shows errors, but I don't know how to fix them. Previously I have tried to display it in the browser, following other procedures, but it has not been possible.

javascript-objeto

1 Answers

  1. Best Answer

    The biggest problem you have is that you are trying to do the function push()on a variable that is not an array . I do not understand what you intended but it is what is causing the error.

    By removing the lines that reference the variable consultayou should be able to correctly insert the text into the DOM .

    let objDos = {
  Dental: [
    {
        HORA: "8:30",
        ESPECIALISTA: "ANDREA ZUÑIGA",
        PACIENTE: "MARCELA RETAMAL",
        RUT: "11123425-6",
        PREVISION: "ISAPRE"
    },
    {
        HORA: "11:00",
        ESPECIALISTA: "MARIA PIA ZAÑARTU",
        PACIENTE: "ANGEL MUÑOZ",
        RUT: "9878789-2",
        PREVISION: "ISAPRE"
    },
    {
        HORA: "11:30",
        ESPECIALISTA: "SCARLETT WITTING",
        PACIENTE: "MARIO KAST",
        RUT: "7998789-5",
        PREVISION: "FONASA"
    },
    {
        HORA: "13:00",
        ESPECIALISTA: "FRANCISCO VON TEUBER",
        PACIENTE: "KARIN FERNANDEZ",
        RUT: "18887662-K",
        PREVISION: "FONASA"
    },
    {
        HORA: "13:30",
        ESPECIALISTA: "EDUARDO VIÑUELA",
        PACIENTE: "HUGO SANCHEZ",
        RUT: "17665461-4",
        PREVISION: "FONASA"
    },
    {
        HORA: "14:00",
        ESPECIALISTA: "RAQUEL VILLASECA",
        PACIENTE: "ANA SEPULVEDA",
        RUT: "14441281-0",
        PREVISION: "ISAPRE"
    }
  ]
}

const clientes = objDos.Dental;

for(item of clientes){
    let text = `<p>${item.HORA}, ${item.ESPECIALISTA}, ${item.PACIENTE}</p>`;
    document.getElementById("consultantes").innerHTML += text;
}
    <div id="consultantes"></div>

    • 0