Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
3
respuestas

Sobre la consola de mi navegador

Hola!! Sucede que en mi consola del navegador, cuando agrego texto y le doy click al botón, no ocurre nada en la consola: Ingrese aquí la descripción de esta imagen para ayudar con la accesibilidadMi código JS es el siguiente:

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

const createTask = (evento)=> {
    evento.preventDefault();
    const input = document.querySelector("[data-form-input]");
    console.log(input.value);
}

console.log(btn);


btn.addEventListener("click", ) 

3 respuestas

Hola Silvia,

Estás muy cerca de resolver el problema. En tu código, estás creando la función 'createTask' correctamente, pero no la estás pasando como argumento para el método 'addEventListener' de tu botón.

Aquí está tu código con la corrección:

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

const createTask = (evento)=> {
    evento.preventDefault();
    const input = document.querySelector("[data-form-input]");
    console.log(input.value);
}

console.log(btn);

btn.addEventListener("click", createTask);

En la última línea, debes pasar la función 'createTask' como argumento al método 'addEventListener'. De esta manera, cada vez que se haga clic en el botón, se ejecutará la función 'createTask'.

¡Saludos!

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

Hola, ya hice la corrección y el problema persiste. Vuelvo a adjuntar mi código:

import checkComplete from "../components/checkComplete";
import deleteIcon from "../components/deleteIcon";

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

const createTask = (evento)=> {
    evento.preventDefault();
    const input = document.querySelector;('[data-form-input]');
    const value = input.value;
    const list = document.querySelector('[data-list]');
    const task = document.createElement('li');
    task.classList.add('card');
    input.value =" ";
    //backsticks

    const taskContent = document.createElement("div");
    taskContent.appendChild(checkComplete());
    const titleTask = document.createElement("span");
    titleTask.classList.add("task");
    titleTask.innerText = value;
    taskContent.appendChild(titleTask);
    taskContent.appendChild(deleteIcon());

    const content =
        
    <i class= "fas fa-trash-alt trashIcon icon"></i>
    //task.innerHTML = content;
    task.appendChild(taskContent);
    task.appendChild(deleteIcon());
    list.appendChild(task);    
};

btn.addEventListener("click", createTask);

¡Hola, Silvia!

Parece que hay un error tipográfico en esta línea:

const input = document.querySelector;('[data-form-input]');

Debería ser así, sin ; despues del "querySelector":

const input = document.querySelector('[data-form-input]');

Asegúrate de corregir estos errores y vuelve a intentarlo. Si el problema persiste o tienes más preguntas sobre el código, no dudes en preguntar.

¡Saludos!

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