javascript - 如何在 TypeScript 中使用 document.getElementById() 方法?

标签 javascript angularjs typescript dom

我正在尝试重置 HTML 表单以清除输入字段中的所有值;

document.getElementById('myForm').reset(); 

但我可以在 typescript 中使用它,它给我一个错误,提示 document.getElementById('myForm') 可能为空

我该如何解决这个问题?

最佳答案

如果您使用 strictNullChecks 选项(或包含 strictNullChecksstrict),Typescript 将强制您检查值是否为空。您可以执行测试或使用非空断言 (!)。此外,您还需要使用类型断言来断言 html 元素是一个 HTMLFormElement,因为默认情况下它只是一个 HtmlElementreset 是仅存在 HTMLFormElement

只是一个断言断言:

(document.getElementById('myForm') as HTMLFormElement).reset();

带检查的断言(推荐):

let form = document.getElementById('myForm')
if(form) (form as HTMLFormElement).reset(); 

非空断言(如果你只想访问 HtmlElement 成员):

document.getElementById('myForm')!.click()

关于javascript - 如何在 TypeScript 中使用 document.getElementById() 方法?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52491832/

相关文章:

javascript - Bootstrap : on hover in Dropdown menu parent menu highlighted

javascript - 在内存和性能方面使用类与接口(interface)的成本

javascript - JS 对象继承与属性

html - Angularjs applycss 指令

angularjs - 最大化 $digest 迭代

javascript - angularJS - 通过在 div 中单击鼠标获取 x 和 y 位置

angular - Ionic 3 - 标签 href 内部链接

javascript - 如何使用 `document.getElementById("a_link").click();`

javascript - 有没有办法以编程方式更改激活的 mat-tab?

typescript - 如何在没有多个 try catch block 的情况下设置多个属性并调用多个服务 - Typescript?