Javascript 使用制表器（HTML）遍历子项

让我们看一段这样的代码：

<article>
    <p>some text</p>
    <p>some text</p>
    <p>some text</p>
    <p>some text</p>
    <p>some text</p>
</article>

一些文本

一些文本

一些文本

一些文本

一些文本

我想使用

选项卡

键迭代这些

-s，并用CSS（大纲或任何其他内容）标记当前选择的

。我曾尝试将

选项卡index

添加到

-s中，但似乎不起作用

我的问题是：

• 是否可以以这种方式迭代非输入/链接元素
• 如果可能，捕获当前元素的伪类是什么
• 奖励：是否可以将迭代保持在
  中？我希望迭代跳转到最后一个之后的第一个
  ，反之亦然

一个纯HTML/CSS解决方案会更好，但我对JS也很满意

是否可以以这种方式迭代非输入/链接元素

是的，使用它就可以了

如果可能，捕获当前元素的伪类是什么

是的，您可以对大纲使用CSS规则：

p:focus{
边框：1px实心#ddd；
}

一些文本
一些文本
一些文本
一些文本
一些文本
此输入不符合选项卡顺序：

是否可以以这种方式迭代非输入/链接元素

是的，使用它就可以了

如果可能，捕获当前元素的伪类是什么

是的，您可以对大纲使用CSS规则：

p:focus{
边框：1px实心#ddd；
}

一些文本
一些文本
一些文本
一些文本
一些文本
此输入不符合选项卡顺序：

使用

tabindex=“0”

到

p

，在css

中使用
背景：红色和
宽度：适合内容只适合
背景
文本
内部

还可以使用
onmousedown=“return false；”
来防止鼠标单击焦点


p:focus{
背景：红色；
宽度：适合的内容；
}

一些文本
一些文本
一些文本
一些文本
一些文本
使用
tabindex=“0”
到
p
，在css
中使用
背景：红色和
宽度：适合内容只适合
背景
文本
内部

还可以使用
onmousedown=“return false；”
来防止鼠标单击焦点


p:focus{
背景：红色；
宽度：适合的内容；
}

一些文本
一些文本
一些文本
一些文本
一些文本
选择文章中的所有p。将它们的tabIndex设置为0。然后在窗口上添加事件侦听器。如果文章中的最后一个p是焦点，那么下一个焦点元素将是p列表中的第一个元素


const ps=document.queryselectoral（'article>p'）；
ps.forEach（（p）=>p.tabIndex=0）；
ps[0].focus（）；
window.addEventListener（“向下键”，函数（e）{
常量代码=e.keyCode；
if（code==9&&ps[ps.length-1]==document.activeElement）{
ps[0].focus（）；
e、 预防默认值（）；
}
}，假）
p:focus{
边框：1px纯黑；
}

一些文本

一些文本

一些文本

一些文本

一些文本

选择文章中的所有p。将它们的tabIndex设置为0。然后在窗口上添加事件侦听器。如果文章中的最后一个p是焦点，那么下一个焦点元素将是p列表中的第一个元素


const ps=document.queryselectoral（'article>p'）；
ps.forEach（（p）=>p.tabIndex=0）；
ps[0].focus（）；
window.addEventListener（“向下键”，函数（e）{
常量代码=e.keyCode；
if（code==9&&ps[ps.length-1]==document.activeElement）{
ps[0].focus（）；
e、 预防默认值（）；
}
}，假）
p:focus{
边框：1px纯黑；
}

一些文本

一些文本

一些文本

一些文本

一些文本

最好将这些
-s作为唯一可用于制表符的元素。如何实现它？@Nekomajin42-您可以通过向元素添加
tabindex=“-1”
，使其默认处于选项卡顺序而不是选项卡顺序；请参阅更新的答案。不过，我不建议这样做。请注意，即使您这样做，在大多数用户代理上，从页面上最后一个可制表符的元素进行制表符切换也会将您完全带出页面（进入用户代理的UI，如地址栏）。我正在开发一个electron.js应用程序，加上此文档将位于
iframe
中，标记最少，因此这不是问题。我会尝试一下。最好是让这些
-s成为唯一可以制表的元素。如何实现它？@Nekomajin42-您可以通过向元素添加
tabindex=“-1”
，使其默认处于选项卡顺序而不是选项卡顺序；请参阅更新的答案。不过，我不建议这样做。请注意，即使您这样做了，在大多数用户代理上，从页面上最后一个可制表符的元素进行制表符切换也会将您完全带出页面（在