如何解决TypeScript报错：Property 'zoom' does not exist on type 'CSSStyleDeclaration'

因为zoom是非标准CSS属性，TypeScript的CSSStyleDeclaration类型定义里没有包含它，所以会抛出类型错误。你之前用/* tslint:disable-next-line */无效是因为这是TypeScript的类型检查错误，不是TSLint的规则问题，下面是几种可行的解决方法：

• 方法一：使用类型断言绕开检查
  把元素的style对象断言为any类型，跳过TypeScript的类型校验：

  const cssZoomOfTable = (+(document.querySelector<HTMLElement>("[data-qa=table]")?.style as any)?.zoom || 1).toFixed(2);
  

• 方法二：扩展CSSStyleDeclaration类型
  在项目中创建一个全局类型声明文件（比如global.d.ts），添加zoom属性的定义：

  interface CSSStyleDeclaration {
    zoom?: string;
  }
  

  确保该文件被TypeScript识别，可在tsconfig.json的include数组中加入这个文件的路径（比如"./global.d.ts"）。

• 方法三：使用getPropertyValue方法获取属性
  利用DOM的getPropertyValue方法直接获取CSS属性值，这个方法不受类型定义限制：

  const cssZoomOfTable = (+document.querySelector<HTMLElement>("[data-qa=table]")?.style.getPropertyValue('zoom') || 1).toFixed(2);
  

• 方法四：临时禁用TypeScript检查（谨慎使用）
  如果只是临时跳过这一行的类型检查，可以用TypeScript专属的// @ts-ignore注释：

  // @ts-ignore
  const cssZoomOfTable = (+document.querySelector<HTMLElement>("[data-qa=table]")?.style?.zoom || 1).toFixed(2);
  

  注意：这种方法会跳过该行所有类型检查，可能隐藏其他潜在问题，尽量少用。

内容的提问来源于stack exchange，提问作者pesho hristov