Syntax
var closestElement = targetElement.closest(selectors);
자신을 포함해서 부모요소로 향하며, selecotrs 조건에 맞는 node가 나올 때까지 찾고, 나오면 해당 node를 반환하고 끝낸다.
못 찾았다면 null 이 반환된다.
-----------=-------------
jQuery의 parents 와 유사 동작 다만 차이는
closest는 자기 자신도 체크 범위에 포함함.
jQuery의 parents는 자기 자신은 체크 범위에 포함 안됨.
<ul>
<li class="li-p-class">
<ul class="ul-class">
<li id="test" class="li-t-class">~~~</li>
</ul>
</li>
</ul>
document.getElementById('test').closest('li').className;
document.getElementById('test').closest('ul').className;
=> "ul-class"
$('#test').parents('li').prop('className');
=> "li-p-class"
$('#test').parents('ul').prop('className');
=> "ul-class"
document.getElementById('test').closest('XXX')
=> null