Javascript HTML表单的好坏？

1个文本框和2个标签元素“链接”到1个文本框是否合法

假设文本框是一个搜索字段。两个标签元素代表两种不同类型的东西，你可以搜索。例如，单击标签1将聚焦文本框并更改基础表单隐藏属性。例如：

<form method="" action="">
   <label for="search" id="books">Search Books</label>
   <label for="search" id="games">Search Games</label>
   <input type="search" name="search" id="search" placeholder="What are you looking for?" />
</form>

<script type="javascript">
   // IF LABEL 1 (BOOKS) IS CLICKED, THEN SET HIDDEN FORM ELEMENT TO "BOOKS"
   // IF LABEL 2 (GAMES) IS CLICKED, THEN SET HIDDEN FORM ELEMENT TO "GAMES".
</script>

查册
搜索游戏
//如果单击标签1（书籍），则将隐藏的表单元素设置为“书籍”
//如果单击标签2（游戏），则将隐藏表单元素设置为“游戏”。

---

对搜索引擎优化有什么影响？我能想到一些，但不确定它们是否是有效的关注点。

它没有什么问题，但设计很差

---

我建议使用一组单选按钮或

让用户选择他们要搜索的内容。

这没有什么问题，但设计很差

---

我建议使用一组单选按钮或

让用户选择他们正在搜索的内容。

如果您想检查它是否为“合法”html/css，请询问W3C验证程序：

---

如果您想检查它是否为“合法”html/css，请询问W3C验证程序：

---

不，你将因滥用HTML而被HTML警察逮捕。这很好。我不相信有任何负面SEO的影响。据我所知，爬虫不会对标签数量和输入数量进行检查。我不会坐牢，是吗-（@zzzzBov我有点希望它们真的存在。不，你会因为滥用HTML而被HTML警察逮捕。jk没关系。我不相信有任何负面的SEO影响。据我所知，爬虫不会对标签和输入的数量进行检查。哈哈。我不会坐牢的，对吧-（@zzzzBov我有点希望它们真的存在。我会使用单选按钮，但我不喜欢整个圆圈的东西，它真的与界面的其余部分发生了冲突（看起来不太好）.事实上，我想我会看看谷歌的HTML源代码，因为它们在他们的页面上有相同的效果。不过谢谢你的回答。看起来他们使用的是有序列表（ol）。我到底为什么没有想到这一点呢！我什么都用列表：-/（夸张）谢谢@Kolink，我决定使用无序列表。通过无线电或select检测onchange事件，而不是onclick事件，对键盘用户和移动用户来说会更好（请参阅：）。单选元素应该不需要在onchange启动时可见，只要有适当的标签元素。我会使用单选按钮，但我不喜欢整个圆圈，它确实会与界面的其余部分发生冲突（看起来不太好）.事实上，我想我会看看谷歌的HTML源代码，因为它们在他们的页面上有相同的效果。不过谢谢你的回答。看起来他们使用的是有序列表（ol）。我到底为什么没有想到这一点呢！我什么都用列表：-/（夸张）谢谢@Kolink，我决定使用一个无序列表。通过radio或select检测onchange事件，而不是onclick事件，对键盘用户和移动用户来说会更好（请参阅：）。只要有适当的标签元素，onchange启动时，radio元素不必可见。