JS文件中的TS警告：“属性X不存在于类型X上”：是否可以编写更简洁的JavaScript？

Question

我目前正在发现TypeScript。我使用以下代码：

const someClass = document.querySelector(".that-class");    
const someId = document.getElementById("elemId").value;

正如我之前的许多其他人一样，当然还有更多的人，我得到了以下错误：

Property 'style' does not exist on type 'Element'.
Property 'value' does not exist on type 'HTMLElement'.

我在我的电脑中修复了这些错误。通过添加

我的问题很简单：有没有一种方法可以避免JS文件中出现这些错误（例如：有没有一种“更干净”的方法来编写JavaScript代码）？或者我应该忽略这些警告吗？

非常感谢你的帮助！




Answer 1

这里有一些好消息：我找到了我想要的答案。

给你一些额外的上下文：我正在处理一个表单，需要使用JavaScript/TypeScript操作一些用户输入。以下是代码：

<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>

和我的JavaScript代码：

function showValue() {
    const myForm = document.getElementById("my-form").value;
    console.log(myForm);
    return 1;
}

这将返回警告：“属性'value'在类型'HTMLElement'上不存在。

通过在TypeScript中添加此代码的一些变体，可以很容易地解决这个问题：

const myForm = (<HTMLInputElement>document.getElementById("my-form")).value;

太好了，在打字脚本中没有更多的警告。但编译后，生成的JavaScript文件将再次显示警告：“属性“X”在类型X上不存在”

因此，我的问题是，我如何编写我的代码，这样我就不会收到任何警告？

我希望能找到如下答案：

function showValue() {
    const myForm = document.forms.my-form;
    console.log(myForm?.username.value);
    return 1;
}

我花了很长时间才找到它，并在规范文档中进行了一些挖掘，但希望这似乎有效！

我仍然要感谢你们所有人的评论，他们在我寻找答案的过程中帮助很大。