8 个你不需要使用库的原生 HTML 元素

不要再与浏览器对抗了。不要再为那些你已经拥有的功能去安装库了。

试试这 8 个原生 HTML 元素：

  • <dialog>：用于模态框。它会自动处理焦点和背景遮罩。
  • <details> 和 <summary>：用于折叠面板。
  • popover：用于菜单。它完全不需要 JavaScript。
  • <select> 和 <datalist>：用于下拉列表和自动完成。
  • <input type="range">：用于滑块。可以用 CSS 进行样式定制。
  • <input type="color">：用于颜色选择器。
  • <input type="date">：用于日历。在移动端表现良好。
  • loading="lazy"：用于图片懒加载。

“原生优先”并不意味着零依赖。它的意思是，在使用 npm 之前，先查阅文档。

库会让你的代码停滞不前。而浏览器在不断进步，你可以免费继承这些新特性。

减少代码量。获得无障碍支持。减少维护时间。

先查阅平台文档。有一半的情况，你想要的功能只需一个标签就能实现。

来源：https://dev.to/dimonb19a/8-native-html-elements-you-dont-need-a-library-for-29b4