javascript-如果从或扩展,“扩展”选项是否允许我直接将>元素添加到自定义元素?

我有一个自定义元素< my-element>.其目的是使行为像< ol>元件.我正在使用实例化它:

class MyElement extends HTMLElement { ... }
window.customElements.define('my-element', MyElement, { extends: 'ol' });

生成的HTML如下所示:

<my-element>
  <li>...</li>
  <li>...</li>
  <li>...</li>
</my-element>

自然,这将使基本的HTML验证失败:

Error: Element li not allowed as child of element my-element in this context. (Suppressing further errors from this subtree.)

Contexts in which element li may be used:

  • Inside ol elements.
  • Inside ul elements.

但是,验证者不知道我是从< ol>开始的元素.是否存在extends:“ ol”使我可以添加< li>元素直接添加到我的组件中,还是我仍然需要提供< ol>包装纸?

注意:此问题与put a `<custom-tag>` instead of a `<ul>` or `<ol>` to create a list非常相似,但是在定义新的自定义元素时未提及extends选项.因此,我认为适合提出一个新问题,而不是潜在地弄乱那个问题的含义.

解决方法:

根据规范,Custom Elements最终将能够扩展其他元素.但是现在不是时候.

https://developers.google.com/web/fundamentals/web-components/customelements#extend

Warning: At time of writing, no browser has implemented customized built-in elements (07001).

但这并不能阻止您的自定义元素像另一个元素一样工作.

只需研究所有必需的ARIA属性以及所需的CSS.

相关文章

HTML5和CSS3实现3D展示商品信息的代码
利用HTML5中的Canvas绘制笑脸的代码
Html5剪切板功能的实现
如何通过HTML5触摸事件实现移动端简易进度条
Html5移动端获奖无缝滚动动画实现
关于HTML5和CSS3实现机器猫的代码