Konvertere Element til HTMLElement i javascript/typescript


Så jeg får en liste over elementer som matcher en velger ved å bruke querySelectorAll, som lagrer dem i en NodeList.

Jeg skanner deretter gjennom NodeList med en forEach-løkke, på dette tidspunktet er typen til hvert enkeltElement "Element".

Men jeg mater disse individuelle elementene inn i en funksjon "doThing()" som forventer at individuelle elementer er av typen "HTMLElement" (jeg bruker TypeScript). Jeg lurer på om det finnes en innebygd JS-funksjon for å konvertere en "Element"-type til en "HTMLElement"-type, eller, hvis ikke, hvordan en slik funksjon kan se ut.

const h = document.querySelectorAll(someClassString);

h.forEach(individualItem => {
            individualItem.addEventListener(c.EVENT, () => doThing(individualItem));
})    

Svar #1

For å skrive ut resultatet fra querySelectorAll kan du gjøre det på denne måten:

document.querySelectorAll<HTMLTableElement>('.mytable')

Svar #2

Siden du bruker TypeScript, hvorfor kaster du det ikke til en annen type? Se det her

const h = document.querySelectorAll(someClassString);

h.forEach(individualItem => {
    individualItem.addEventListener(c.EVENT, () => doThing(individualItem as HTMLElement));
});

REDIGER 2023

Jeg vet ikke om jeg hadde begrenset kunnskap om Typescript da jeg skrev dette, eller om denne funksjonaliteten ikke var tilgjengelig ennå, men som Ron Jonk påpekte, er den mest elegante og gjenbrukbare løsningen

const h = document.querySelectorAll<HTMLElement>(someClassString);

h.forEach(individualItem => {
    individualItem.addEventListener(c.EVENT, () => doThing(individualItem));
});

Relaterte artikler