【TS】Error: Property ‘click‘ does not exist on type ‘Element‘

举个例子:

// 假设页面上按钮的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,其他获取方式都是类似的,总之,需要使用类型断言。

猜你喜欢

转载自blog.csdn.net/weixin_38629529/article/details/127129993
今日推荐