新的HTML标签<search>详解
敲键小勇士
2024-04-02 17:21
另一个需要注意的关键点是,搜索区域不一定是网站或在线平台上带有搜索按钮的文本输入框。我们可以使用 <search>
来过滤结果或表格行。它的实用性不仅限于文本输入和搜索框:
<search>
<h2>Filter results</h2>
<form>
<label for="cartype">Car type</label>
<select id="cartype">
<option value="coupe">Coupe</option>
<option value="sedan">Sedan</option>
</select>
<label for="electric">Electric?</label>
<input type="checkbox" id="electric" />
</form>
</search>
看法
拥有一个用于识别搜索区域的元素是很好的。正如Scott O'Hara在这篇文章中指出的那样,直到现在,这是唯一一个在HTML中没有语义等效项的ARIA地标角色:
- banner →
<header>
- complementary →
<aside>
- form →
<form>
- main →
<main>
- navigation →
<nav>
- region →
<section>
- search → ???
使用 <search>
来标识应具有“搜索”角色的部分,我们将使用一些语义化的 HTML 元素覆盖所有 ARIA 地标角色。这很棒:它将提高可访问性(尽管如上所述,需要一段时间才能让所有浏览器跟上),并扩展了语言的语义。
但是,从程序员的角度来看,它感觉不够完善或没有为现有的实现增加太多东西。其他语义元素可以提高可访问性并简化我们编写特定组件的方式。例如,像 <tabpanel>
和<tab>
这样的东西,在我看来会更具说服力和价值。
这并不会削弱它的重要性。所有的改进 - 即使是微小的改进 - 都是受欢迎的。这也适用于 <search>
。这是 HTML 家族的一个极好的新成员。
代码部署后可能存在的BUG没法实时知道,事后为了解决这些BUG,花了大量的时间进行log 调试,这边顺便给大家推荐一个好用的BUG监控工具 Fundebug。
到此这篇关于新的HTML标签<search>详解的文章就介绍到这了,更多相关HTML标签<search>内容请搜索编程学习网以前的文章或继续浏览下面的相关文章希望大家以后多多支持编程学习网!
免责声明:
① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的,并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据,供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。
② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341