Olá,
Pelo que eu havia entendido, no JS tanto faz utilizar o QuerySelectorAll como getElementsByClassName. Nos dois casos eu faço a mesma coisa, mas o QuerySelector como é mais abrangente, por conseguir pegar qualquer elemento, é mais prático de utilizar.
const el = document.querySelectorAll('.class-name')
// é a mesma coisa que
const el = document.getElementsByClassName('class-name') Só que na hora de tipar essas variáveis o VSCode me informa que o getElement é um HTMLCollectionOf<Element> e o QuerySelector é um NodeListOf<Element>. Isso no final das contas acaba sendo muito similar e não tendo muito motivo para eu ficar entendendo melhor cada tipo ? Ou tem relevância entender essas diferenças ?
Ainda sobre os tipos, se eu continuo o código fazendo o seguinte:
const nextEl: ChildNode = <ChildNode>el[i].parentNode?.nextSibling;
if (nextEl.style.maxHeight) {
nextEl.style.maxHeight = null;
} else {
nextEl.style.maxHeight = nextEl.scrollHeight + 'px';
}O VsCode dá um erro dizendo que a propriedade style não pertence ao tipo ChildNode. Porém o atributo parentNode e nextSibling pertencem ao tipo ChildNode (por isso eu restringi o tipo para ChildNode).
Se eu não tipar, continua dando erro. Mas se eu tipar como any compila normalmente e o código funciona como eu gostaria. Mas em tese eu não deveria usar o any, não é ?