SVGElement: свойство tabIndex

Базовая Широко доступно

Эта функция хорошо зарекомендовала себя и работает на многих устройствах и версиях браузеров. Она доступна в браузерах с января 2020 года.

Свойство tabIndex интерфейса SVGElement представляет собой порядок табуляции текущего SVG-элемента.

Порядок табуляции следующий:

Элементы с положительным значением tabIndex. Элементы с одинаковыми значениями tabIndex должны проходить через порядок табуляции в соответствии с их порядком отображения. Переход происходит от самого низкого значения tabIndex к самому высокому tabIndex.
Элементы, которые не поддерживают атрибут tabIndex или поддерживают его и присваивают tabIndex значению 0, в порядке их отображения.

Отключенные элементы не участвуют в порядке табуляции.

Значения не обязательно должны быть последовательными, ни начинаться с определенного значения. Они могут быть даже отрицательными, хотя каждый браузер обрезает очень большие значения.

Значение

Целое число.

Примеры

Установка свойства `tabIndex`

<svg id="svg1" tabindex="2" xmlns="http://www.w3.org/2000/svg" role="img">
  <circle cx="50" cy="50" r="40" fill="blue"></circle>
</svg>
<svg id="svg2" xmlns="http://www.w3.org/2000/svg" role="img">
  <rect width="100" height="100" fill="green"></rect>
</svg>

const svg1 = document.getElementById("svg1");
const svg2 = document.getElementById("svg2");

// Access and modify the tabIndex
console.log(svg1.tabIndex); // 2
svg2.tabIndex = 1; // Add svg2 to the tab order before svg1

// Programmatically focus on an element with negative tabIndex
svg1.tabIndex = -1;
svg1.focus(); // Works, even though it is not in the tabbing order

Спецификации

Спецификация
HTML # dom-tabindex

Совместимость браузеров

	Рабочий стол					Мобильный
	Chrome	Edge	Firefox	Opera	Safari	Chrome Android	Firefox для Android	Opera Android	Safari на iOS	Samsung Internet	WebView Android
`tabIndex`	36	17	51	23	8	36	51	24	8	3.0	37

См. также

HTMLElement.tabIndex аналогичный метод для HTML-элементов.
Доступность JavaScript-виджетов, навигация по которым возможна с помощью клавиатуры
Глобальный атрибут HTML tabindex.