Как проверить, что текущий фокусированный элемент лежит до или после целевого элемента, используя JavaScript

Question

Основная проблема в том, что у меня есть 3 div. Первый и третий div имеют списки (li), в то время как второй div - это просто разделитель, я хочу, чтобы при использовании табуляции я не просматривал полные списки первого div. При нажатии на вкладку фокус должен быть в моем первом элементе списка первого div для навигации. Я использую клавиши со стрелками. При нажатии на вкладку второй раз фокус должен быть на первом элементе списка третьего div и на нажатии на вкладку.

Единственное, что осталось - я просто хочу прекратить навигацию по полному списку, используя вкладку, и если фокус находится на элементах списка первого элемента div, то при нажатии на элемент табуляции следует перейти к первому элементу списка второго элемента div.

Я просто хочу прекратить навигацию по полному списку, используя вкладку, и если фокус находится на элементах списка первого элемента div, то при нажатии кнопки табуляции фокус должен перейти к первому элементу списка второго элемента div.

Answer 1

Вы должны использовать tabindex.

Пример из w3schools

<a href="https://www.w3schools.com/" tabindex="2">W3Schools</a><br>
<a href="http://www.google.com/" tabindex="1">Google</a><br>
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>

Вы можете узнать больше о tabindex здесь