Typescript:初始化一个空的NodeListOf

8ehkhllq  于 2023-06-24  发布在  TypeScript
关注(0)|答案(2)|浏览(209)

我在TS中挣扎与querySelectorAll。我想用这个选择器访问任何HTML元素,不管它是按钮,输入等等。
对于querySelector,我做了这样的事情(效果很好):

function selector(element: HTMLElement, selector: string): HTMLElement | null {
    return element.querySelector(selector);
}

const element: HTMLElement | null = selector(document.body, '.my-button');

这是我对querySelectorAll的类似方法:

function selectorAll(element: HTMLElement, selector: string): NodeListOf<HTMLElement> {
    return element.querySelectorAll<HTMLElement>(selector);
}

现在我的问题是我不能初始化一个空的节点列表。例如:

let buttons: NodeListOf<HTMLElement> = [];
buttons = selectorAll(document.body, 'button');

编译器说:类型“never[]”中缺少属性“item”,但类型“NodeListElement”中需要该属性。
那么,初始化空NodeListOf类型的正确语法是什么呢?

wnavrhmk

wnavrhmk1#

除了调用querySelectorAll和相关的DOM API之外,没有其他简单的方法可以使用NodeList接口创建对象。
一种替代方法是使用array而不是NodeList

let buttons: Array<HTMLElement> = [];
buttons = Array.from(selectorAll(document.body, 'button'));
wnvonmuf

wnvonmuf2#

要让return element.querySelectorAll<HTMLElement>(selector);返回数组而不是NodeList,你可以这样写:

return [...element.querySelectorAll<HTMLElement>(selector)];

相关问题