tabindexのデバッグ方法

Question

tabindexの機能をデバッグするためのWebブラウザ用のツールやプラグインはありますか？ tabindex属性は正しいと思われますが、期待どおりに動作しません。それとも私は何か悪いことをしますか？

Answer 1

FireFoxを使用する場合は、Webdeveloper toolbarを入手してください。あなたはタブのインデックスを表示することができます。これはデバッグに役立ちます。ここ

そして、そのオプションを検索する場所です：

Answer 2

クロームでは、要素を右クリックし、コンテキストメニューから「点検」を選択することができます。その後、コンソールに切り替えて$0.tabIndexと入力します。

説明：$ 0 - $ 4は、あなたが検査した最後の4つの要素を参照しています。 tabIndexは、DOM APIのHTMLEelementの標準プロパティです。

あなたはF12を押すと、コンソールタブに移動してクロム、Firefox、およびIEでの開発ツールを使用して、次を挿入することができhttps://developers.google.com/web/tools/chrome-devtools/console/command-line-reference

Answer 3

を参照してください：

今

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

フォーカス可能なアイテムをタブすると、tabindexを含むactiveElementがあります。セットが1つあれば、コンソールに出力されます。