하위 노드,요소(엘리먼트) 전체 확인하여 ID값 출력하기
간혹 특정 ID(선택자)에 속한(하위) 전체를 확인하고 싶을 때가 있습니다.
동적으로 생성되는 경우 더더욱 그렇습니다.
<script>
function getNextNodesIn(node, includeWhitespaceNodes)
{
var textNodes = [], nonWhitespaceMatcher = /\S/;
function getNextNodes(node)
{
/*
1: 요소-엘리먼트
2: 속성
3: 텍스트
8: 주석노드
*/
if (node.nodeType == 1)
{
for (var i = 0, len = node.childNodes.length; i < len; ++i)
{
getNextNodes(node.childNodes[i]);
if ( typeof(node.childNodes[i].previousSibling) == 'object' )
{
if ( node.childNodes[i].previousSibling == null ) {
continue;
}
var child_id = node.childNodes[i].previousSibling.id;
if ( typeof(child_id) == 'string' && child_id.length > 0 ) {
console.log('id값: ', child_id);
}
}
}
}
else if ( node.nodeType == 2 ) {
// console.log('');
}
// nodeType 3은 텍스트를 말한다.
else if (node.nodeType == 3) {
// if (includeWhitespaceNodes || nonWhitespaceMatcher.test(node.nodeValue)) {
// }
}
else {
}
}
getNextNodes(node);
}
// 하위노드 id 모두 출력하기
var node = document.getElementById('test');
getNextNodesIn(node);
</script>
* 참고한 곳
https://developer.mozilla.org/en-US/docs/Web/API/Node/nodeType