Question

const labelEl: HTMLElement = document.createElement('label')
const isElOfNeededType = (el: HTMLElement): boolean =>
    ["INPUT", "TEXTAREA"].includes(el.tagName);

let result

if (isElOfNeededType(labelEl.nextElementSibling)) {
    result = true
}

这是我的游乐场：link

为什么我在labelEl.nextElementSibling上遇到此错误？

“元素”类型的参数不能分配给“ HTMLElement”类型的参数

HTMLElement不扩展Element吗？

2。（不是很重要，但是如果得到解释会很高兴）为什么TS游乐场抱怨[ ].includes而我设置了Config -> Target = esnext？

Answer 1

labelEl.nextElementSibling的类型为Element。请参见“绝对类型”中的definition。因此，您的代码正在尝试传递Element所在的HTMLElement。

正如您所说，HTMLElement扩展了Element，但这确实意味着您可以通过Element来代替HTMLElement，因为Element可能会没有HTMLElement具有的属性。但是，您可以在期望HTMLElement的地方传递Element，因为HTMLElement将具有Element的所有属性。

由于您只对tagName上的Element属性感兴趣，所以我只是将您的代码更改为使用Element。

const labelEl: HTMLElement = document.createElement('label')
const isElOfNeededType = (el: Element): boolean =>
    ["INPUT", "TEXTAREA"].includes(el.tagName);

let result

if (isElOfNeededType(labelEl.nextElementSibling)) {
    result = true
}

“元素”类型的参数不能分配给“ HTMLElement”类型的参数

1 个答案: