Получить индекс элемента, на который произведен клик на странице

Question

Имеется следующая функция, которая выводит в консоль путь от элемента до body, при нажатии на любой элемент страницы.

document.addEventListener('click', function (e) {
        tree = e.path; // Сам путь (готовое свойство события)
        const index = tree.findIndex(item => (item.tagName.toLowerCase() === 'body'))
        console.log(tree.slice(0, index + 1)); // Выводим путь при клике до body
})

Как сделать так, чтобы, таких элементов несколько (в одном div два img например), то возвращался их порядковый номер (индекс), а так же, чтобы при наведении на любой элемент страницы, элемент выделялся (обводкой его границ допустим)

Answer 1

Да просто

 alert(e.path.reverse().splice(3));

или

 alert(e.path.reverse().splice(3).reverse());

или

 alert(e.path.splice(0,e.path.length-3));

Как больше нравится.

Чтобы выделяло линией:

let selected; 
document.body.onmousemove = e => { 
  let { x, y } = e; 
  if(selected) selected.style.outline = '';
  selected = document.elementFromPoint(x,y);
  if(selected) selected.style.outline='1px solid red';
};

БЛОГ НА HUSL

Получить индекс элемента, на который произведен клик на странице

Ответы (1 шт):