扩展`<header>`、`<main>`、`<footer>`和`<aside>`标签

Question

扩展<header>、<main>、<footer> 和<aside> 标签的正确类是什么。没有HTMLHeaderElement、HTMLMainElement、HTMLFooterElement和HTMLAsideElement

那么获得行为的正确方法是什么

class CustomHeader extends what? <!-- HTMLElement --> {
  constructor() {
    super()
  }
}
class CustomMain extends what? <!-- HTMLElement --> {
  constructor() {
    super()
  }
}
class CustomFooter extends what? <!-- HTMLElement --> {
  constructor() {
    super()
  }
}
class CustomAside extends what? <!-- HTMLElement --> {
  constructor() {
    super()
  }
}
customElements.define('custom-header', CustomHeader, { extends: 'header' })
customElements.define('custom-main', CustomMain, { extends: 'main' })
customElements.define('custom-footer', CustomFooter, { extends: 'footer' })
customElements.define('custom-aside', CustomAside, { extends: 'aside' })

<header is="custom-header"></header>
<main is="custom-main"></main>
<footer is="custom-footer"></footer>
<aside is="custom-aside"></aside>

• Extending an HTML Element 没有回答问题

Answer 1

目前没有header、main、aside 等的全局接口。元素，所以看起来你现在正在做的事情是正确的。虽然，大多数浏览器会强制此实例遵守规范中针对您将 HTMLElement 对象绑定到的元素的指南（即允许的 aria 规则）。如果您确实想查看是否有更好的类可用，可以查看 MDN 的 DOM Interface 列中的元素列表。

Element Name	DOM Interface
header	HTMLElement
main	HTMLElement
aside	HTMLElement