HTMLUnknownElement的使用

HTMLUnknownElement ‌是指那些在HTML规范中未被明确定义或不被支持的元素。当你在网页中使用一个未被浏览器识别的标签时,该标签就会被视为一个 HTMLUnknownElement 。例如,如果你写了一个标签<chanlaogui>,这个标签就是一个HTMLUnknownElement,因为HTML规范中并没有定义这个标签‌。

WebComponents API是比较高级复杂的标准化API,所以对于简单的网页可以不使用它,它与HTMLUnknownElement的相似之处是,都可以自定义一个全新的html标签名。

不同的是,

  • 未知元素 :如果浏览器遇到一个它不认识的 HTML 标签(例如 <my-custom-tag>),它会将其解析为 HTMLUnknownElement

  • 自定义元素 :如果你正确地使用 Custom Elements API 定义了一个自定义元素(例如 <my-element>),它就不会被视为 HTMLUnknownElement,而是会继承 HTMLElement 或其它特定的元素接口。

所以,对于简单的app项目,不需要定义再使用新的html元素了,直接使用HTMLUnknownElement就好了,直接在html中写新的标签比如<news>表示新闻版块。好处就是不需要定义id和class为news了,方便快捷。

兼容性

HTMLUnknownElement 在现代浏览器中广泛支持,但如果你使用自定义元素,请确保检查 Custom Elements API 的兼容性

虽然比较"反直觉"但是未知元素比自定义元素的兼容性还要好,可以放心大胆的使用。就是有些默认css样式需要设置,比如display:block;。经过我的多方考察和询问,使用HTMLUnknownElement确实没有任何问题,而且比webcomponent更方便,比如名词中不需要加连字符"-",想到一个单词就能用。只是要注意避开常见的原生html名就好了,很简单!

相关推荐
huanmieyaoseng1003几秒前
Mybatis常见面试题
java·开发语言·mybatis
FmZero2 分钟前
后端全栈路线(9小时前端速成)
前端·vscode·学习
万世浮华戏骨4 分钟前
Web 后端 Python 基础安全
前端·python·安全
Dontla6 分钟前
JWT认证流程(JSON Web Token)
前端·数据库·json
無限進步D5 小时前
Java 运行原理
java·开发语言·入门
難釋懷5 小时前
安装Canal
java
是苏浙5 小时前
JDK17新增特性
java·开发语言
余人于RenYu6 小时前
Claude + Figma MCP
前端·ui·ai·figma
阿里加多8 小时前
第 4 章:Go 线程模型——GMP 深度解析
java·开发语言·后端·golang
杨艺韬8 小时前
vite内核解析-第2章 架构总览
前端·vite