javascript - 选项卡式界面的标记

Question

我检查了几个选项卡式界面(包括 jQuery UI)的解决方案，标记始终遵循相同的 ul-li-a 模式:

<ul class="tabs">
<li><a href="#tab1">Title 1</a></li>
<li><a href="#tab2">Title 2</a></li>
</ul>

这是否被认为是最佳实践，为什么？到目前为止，我一直使用 span 或 div 标签，并且一切正常。另外，为什么是“a”标签？它们只是在这里触发旧浏览器上的悬停和事件状态吗？

Answer 1

它是语义标记有几个原因:

1. 这是一个无序列表，即标题 1、标题 2 等。

2. 如果 JavaScript 被禁用，那么您的标记中将有 ID 为 tab1 和 tab2 的 div 元素，然后链接将正常运行并将您发送到正确的 div .

3. 它使选项卡可访问。

还有很多reasons for using semantic HTML .