如何调试tabindex

【问题标题】：How to debug tabindex如何调试tabindex
【发布时间】：2012-08-09 09:03:56
【问题描述】：

是否有任何用于 Web 浏览器的工具或插件来调试 tabindex 功能？ tabindex 属性似乎是正确的，但它的行为与预期不同。还是我做错了什么？

【问题讨论】：

【解决方案1】：

您可以在 Chrome、Firefox 和 IE 中使用开发者工具，方法是按 F12 并导航到控制台选项卡，然后插入以下内容：

document.addEventListener('keyup', function() {console.log(document.activeElement)})

现在，当您浏览可聚焦项目时，activeElement 包括其 tabindex，如果您有一组，将被打印到控制台。

【讨论】：

【解决方案2】：

如果您使用 FireFox，请获取 Webdeveloper toolbar。您可以显示标签索引，这可能有助于您调试。

这里是找到该选项的地方：

【讨论】：

【解决方案3】：

在 Chrome 中，您可以右键单击一个元素并从上下文菜单中选择“检查”。然后切换到控制台并输入$0.tabIndex。

解释：$0 - $4 是指您检查过的最后 4 个元素。 tabIndex 是 DOM API 的 HTMLEelement 的标准属性。

【讨论】：