举个例子:
// 假设页面上按钮的ID是btn
const btn = document.querySelector('#btn');
// Error: Property 'click' does not exist on type 'Element'.ts(2339)
btn?.click();
解决方案:
const btn = document.querySelector('#btn') as HTMLElement | null;
btn?.click();
document.querySelector方法的返回结果是Element或者null,所以我们使用HTMLElement或者null没有问题,那如果是一个类似数组的对象呢?
// querySelectorAll返回NodeList
const btn = document.querySelectorAll('button') as NodeListOf<HTMLButtonElement>;
for (let i = 0; i < btn.length; i++) {
btn[i].click();
}
// getElementsByClassName返回HTMLCollection
const btn = document.getElementsByClassName('.btn') as HTMLCollectionOf<HTMLElement>;
for (let i = 0; i < btn.length; i++) {
btn[i].click();
}
OK,其他获取方式都是类似的,总之,需要使用类型断言。