根据 window 和 TypeScript 中的 DOM 元素动态分配变量

Question

我想根据 DOM 元素或 window 分配一个变量

const layoutContainer = document.querySelector('[data-test-element="layout"]') ?? window
let pageScrollOffsetY = layoutContainer.scrollTop ?? window.pageYOffset

但属性scrollTop仅存在于 DOM 元素中，我收到此错误： TS2551: Property 'scrollTop' does not exist on type 'Element | (Window & typeof globalThis)'。 您指的是 'scrollTo' 吗？ “Window & typeof globalThis”类型上不存在属性“scrollTop”

Answer 1

您可能应该像这样重写它：

const pageScrollOffsetY = document
  .querySelector('[data-test-element="layout"]')?.scrollTop 
  ?? window.pageYOffset

否则，如果document.querySelector('[data-test-element="layout"]')为空，则layoutContainer可能是window 。 并且windows没有导致运行时错误的scrollTop属性。

---

const layoutContainer = document.querySelector('[data-test-element="layout"]') ?? window
let pageScrollOffsetY = (layoutContainer as Element)?.scrollTop ?? window.pageYOffset