为什么当我通过getElementsByClassName()改变DOM-element时，TypeScript显示错误

Question

我有一个angular2应用程序。由于一些问题，我被迫使用组件的内部方法这样的代码(我明白这是结束比坏，但是…):|

let confirmWindowDOM = document.getElementsByClassName('modal')[0];
confirmWindowDOM.style['z-index'] = "2049";

它产生错误，我可以在控制台中看到:

(program):75 ./some/path/to/component.component.ts
(103,28): error TS2339: Property 'style' does not exist on type 'Element'.

但无论如何，应用程序工作如我所料。

所以有一些问题:

这段代码是清晰的JS。正如我所理解的TypeScript作为JavaScript的超集必须没有问题，但是我有错误，测试失败。即使我像这样修改代码:document.getElementsByClassName('modal')[0]。style['z-index'] = "1051";
1. 我如何抑制这个错误或修复它?

Answer 1

getElementsByClassName返回Element的集合。您可以使用类型断言来告知typescript它实际上是HTMLElement:

let confirmWindowDOM = document.getElementsByClassName('modal')[0] as HTMLElement;