Actualmente estoy descubriendo TypeScript. Yo uso el siguiente código:
const someClass = document.querySelector(".that-class"); const someId = document.getElementById("elemId").value;Como muchos otros antes que yo y seguramente muchos más por venir, recibo los siguientes errores:
Property 'style' does not exist on type 'Element'. Property 'value' does not exist on type 'HTMLElement'. Solucioné estos errores en mi archivo .ts agregando <HTMLElement> o <HTMLInputElement> cuando fue necesario, funciona bien. Pero cuando compilo mi .ts, recibo algunas advertencias de TS de VSCode en el archivo .js.
Mi pregunta es simple: ¿hay alguna manera de evitar estos errores en el archivo JS también (es decir, hay una forma "más limpia" de escribir código JavaScript)? ¿O simplemente debería ignorar estas advertencias de TS?
¡Muchas gracias por su ayuda!
Algunas buenas noticias aquí: encontré la respuesta que estaba buscando.
Para brindarle un contexto adicional: estaba trabajando con un formulario y necesitaba manipular algunas entradas de usuario usando JavaScript/TypeScript. Este es el código:
<form id="my-form" action="index.html" method="get" onsubmit="return showValue();"> <input type="text" name="username"> <input type="text" name="full-name"> <input type="password" name="password"> <button type="button" onclick="showValue();">Send</button> </form>Y mi código JavaScript:
function showValue() { const myForm = document.getElementById("my-form").value; console.log(myForm); return 1; } Lo que devolvería la advertencia: "Property 'value' does not exist on type 'HTMLElement' .
Esto se puede arreglar fácilmente agregando alguna variación de este código en TypeScript:
const myForm = (<HTMLInputElement>document.getElementById("my-form")).value; Genial, no más advertencias en TypeScript. Pero después de compilarlo, el archivo JavaScript resultante volvería a mostrar la advertencia: "Property 'X' does not exist on type X"
Por lo tanto, mi pregunta era, ¿cómo escribo mi código para que no reciba ninguna advertencia?
Espero encontrar la respuesta de la siguiente manera:
function showValue() { const myForm = document.forms.my-form; console.log(myForm?.username.value); return 1; }Me tomó bastante tiempo encontrarlo y buscar en los documentos de especificaciones, ¡pero espero que esto parezca funcionar!
Todavía quiero agradecerles a todos por sus comentarios, me ayudaron mucho a encontrar la respuesta.