Javascript 如何使用CSS标记作为选择器来选择某个元素/元素块？

我还是一个新手，我一直在写这个代码。。。其想法是复制google注册表单，其中输入类型被分组，并且仅在回答之前的输入类型组后显示

我想要实现这一点的方法是将它们分组到包装器标记中，并通过jquery选择它们。以下是我的代码：

$function{ var divs=$wrapper； $next.clickfunction{ var div=divs[0]； 皮； } } 身份 名字 姓 公民身份 仅有一个的 已婚的 寡居的 环状 电子邮件 下一个 身份 名字 姓 公民身份 仅有一个的 已婚的 寡居的 环状 电子邮件 下一个 你好 名字 姓 公民身份 仅有一个的 已婚的 寡居的 环状 电子邮件

---

语义上正确的方法是使用fieldset元素作为包装器元素——fieldset用于将类似或类似的字段输入分组到一个集合组中。图例元素是为字段集提供标题或标题的相关元素

如果不想解决所有问题——并且只关注基于用户交互显示下一组字段的想法——您就可以将带有display:none的隐藏类应用于字段集。然后有选择地删除该类，从而根据用户交互（如单击next按钮）显示字段集

显然，还需要进行更多的验证，以确保在进入下一节之前填写所有输入。从已显示的字段集隐藏“下一步”按钮，甚至切换出旧的字段集，并使用“上一步”按钮导航到以前填写的字段集

但我想说的是，通过正确应用字段集，您所需要做的就是将字段集作为目标，以显示/隐藏子字段，并根据用户交互对其进行更改

另外，如前所述，ID必须是唯一的，我不喜欢使用元素来引起换行和增加间距，这就是display:block和margin CSS样式规则的用途。但我把它都放在那里了，因为这就是你所拥有的

因此，要显示结果，请填写显示的字段，然后单击“下一步”，您将看到下一个字段集和相关字段将出现

const nextButtons=document.querySelectorAll.next'； nextButtons.forEachfunctionnextButton{ 添加EventListener“单击”，显示NextFieldSet； } 函数showNextFieldset{ //通过从第一个匹配的字段集中删除隐藏类来显示下一个字段集 document.querySelector'.question group.hidden'.classList.remove'hidden'； //通过将隐藏类添加到第一个匹配按钮来隐藏上一个“下一步”按钮 document.querySelector'button:not.hidden'。classList.add'hidden'； } .按钮包装{ 文本对齐：右对齐 } 字段集{ 边界：无； } 传奇{ 字号：18px； 字号：600； } 标签{ 显示：内联块； 宽度：100px； } 输入，选择{ 显示：内联块； 宽度：200px； } .隐藏{ 显示：无； } 身份 标题 先生 夫人 太太 另外 名字 姓 下一个 联系 电话号码 手机号码 电子邮件 下一个 地位 公民身份 仅有一个的 已婚的 寡居的 环状

---

ID在文档上必须是唯一的，所以这是第一个问题。要从包装器内的按钮中获取下一个包装器，请考虑使用$Test.Cutest.WrPab.在导航DOM的旁边。哇，谢谢！它真的起作用了！我已经为它工作了很长时间，谢谢！我其实有点喜欢这个答案，我也要试试这个。“非常感谢”谢谢-我刚刚修改了它-所以重新刷新页面以获得更改。正如我所说的——这只是为了显示效果——它需要收紧一点：。Happy coding有一个叫做hidden API element.hidden的东西，它转换为布尔HTML属性hidden并与之同步。我建议使用它，而不是尝试使用CSS类（如.hidden或.hide）复制它。