Solucionado (ver solución)
Solucionado
(ver solución)
2
respuestas

[Duda] TypeError: Failed to execute 'appendChild'

Tengo el siguiente Error y no encuentro una solución, ayuda por favor.

Ingrese aquí la descripción de esta imagen para ayudar con la accesibilidad

const crearNuevaLinea = (nombre, email) => {
    const linea = document.createElement > "tr";
    const contenido = `
            <td class="td" data-td>
                ${nombre}
                </td>
            <td>
                ${email}
            </td>
            <td>
              <ul class="table__button-control">
                <li>
                  <a
                    href="../screens/editar_cliente.html"
                    class="simple-button simple-button--edit"
                    >Editar</a
                  >
                </li>
                <li>
                  <button
                    class="simple-button simple-button--delete"
                    type="button"
                  >
                    Eliminar
                  </button>
                </li>
              </ul>
            </td>
          `;
    linea.innerHTML = contenido;
    return linea;
};

const table = document.querySelector("[data-table]");

//abrir http(metodo.url)
//CRUD - metodos http
//Create - POST
//Read - GET
//Update - PUT
//Delete - DELETE

const listaClientes = () => {
    const promesas = new Promise(function (resolve, reject) {
        const http = new XMLHttpRequest();
        http.open("GET", "http://localhost:3000/perfil");
        http.send();
        http.onload = () => {
            const response = JSON.parse(http.response);
            if (http.status >= 400) {
                reject(response);
            } else {
                resolve(response);
            }
        };
    });
    return promesas;
};

listaClientes().then(datos => {

    datos.forEach(perfil => {
        const nuevaLinea = crearNuevaLinea(perfil.nombre, perfil.email);
        table.appendChild(nuevaLinea);
    });
});
2 respuestas
solución!

Hola Alumno, espero que estés bien.

Gracias por compartir tu código con nosotros.

El error que estás experimentando se debe a un error de sintaxis en la creación de la línea:

const linea = document.createElement > "tr";

La sintaxis correcta para crear un elemento HTML usando document.createElement es la siguiente:

const linea = document.createElement("tr");

Lo que esta sucediendo es que la expresión document.createElement está siendo tratada como una función, pero la sintaxis no es correcta, lo que provoca un error al intentar añadir el nuevo elemento hijo a la tabla.

Para solucionar el problema, simplemente cambia la línea que crea el elemento tr para que use la sintaxis correcta

Si tienes alguna duda, no dejes de preguntar. ¡Estamos aquí para ayudarte!.

¡Saludos!

Si este post te ayudó, por favor marca como solucionado ✓. ¡Continúa con tus estudios!

Cierto! Muchas Gracias! Los detalles en la sintaxis me traen de cabeza.