바로 위의 부모로부터 몇 번째 자식요소인지 자바스크립트를 사용하여 알아내는 방법입니다.


function getIndex(selector) {
  var elem = document.querySelector(selector);
  for(var i = 0; i < elem.parentNode.childNodes.length; i++) {
    if (elem.parentNode.childNodes[i] === elem) {
      console.log('elemIndex = ' + i);
    }
  }
}

아래는 간단한 예제입니다.
<ul>
  <li>0</li>
  <li id="test">1</li>
  <li>2</li>
</ul>



위 코드를 사용하면 id값으로 test를 가진 li 태그가 부모가 가진 자식 요소 중에서 몇 번째에 해당하는지 알아볼 수 있습니다.

getIndex('#id');

> eleIndex = 1

이와같이 해당 요소가 부모가 가진 자식 요소 중에서 몇 번째에 해당하는지 순서(index)를 반환합니다.