[Duda] Dudas varias

Hola Silvia,

Voy a intentar responder a tus preguntas en el mismo orden:

1. La función addEventListener es un método que te permite configurar una función que será llamada cada vez que ocurra un evento específico en un objeto. En tu caso, estás utilizando addEventListener para llamar a una función cada vez que se hace clic en el botón. La función addEventListener toma dos argumentos: el nombre del evento que quieres escuchar (en tu caso, "click") y la función que quieres que se ejecute cuando ese evento ocurra.

2. Para cambiar los colores en Visual Studio Code (VSC), puedes cambiar el tema de color. Para hacerlo, puedes ir a File > Preferences > Color Theme y seleccionar el tema que prefieras. También puedes buscar temas adicionales en el Marketplace de Visual Studio Code.

3. En cuanto al error que ves en la consola, parece que hay un problema con tu código JavaScript. En tu código, tienes una palabra suelta clic después de la definición de tu función. Además de eso averigua si tienes el atributo data-form-btn agregado a tu botón en el HTML, sino el querySelector no podrá encontrarlo. Esto puede estar causando el error. Si eliminas esa palabra y el atributo se encuentra correctamente en el botón, el error debería desaparecer. Tu código debería verse así:

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

btn.addEventListener("click", function () {
    console.log("crear tarea")
})

Espero que esto responda a tus preguntas. Si tienes alguna otra duda, no dudes en preguntar.

¡Saludos!

1. ¿Qué significa "btn"?
2. ¿Qué función cumple "querySelector"?
3. ¿"Input value" se usa para indicador que allí el usuario deberá ingresar un valor?

Y muchas, muchas gracias por las respuestas.

Hola Silvia,

"btn" significa "button", generalmente se usa esta nomenclatura al iniciar una variable que representa un botón.

El "querySelector" es una función de JavaScript que use para buscar la referencia de un elemento del HTML como un botón por ejemplo, por medio de un identificador que puede ser una clase, id o un atributo.

Con esta referencia podemos manipular el elemento por medio de JavaScript, como por ejemplo agregar un efecto cuando el usuario hace el clic sobre él. "value" es un atributo que todo input, es ahí donde queda almacenado todo texto por ejemplo que el usuario digita.

Recomiendo la lectura de la documentación de JavaScript, allá encontrarás información de todo, incluso esto que te estoy explicando: https://developer.mozilla.org/es/docs/Web/JavaScript

También recomiendo la lectura de artículo de nuestra instructora Ellen: https://www.aluracursos.com/blog/que-es-dom

En este artículo, podrás entender que es el DOM y como funciona la estructura de una página web.

Se tiene alguna duda más, no dejes de preguntar.

¡Saludos!