微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

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.

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。