42. (javascript/자바스크립트) document childElementCount 자식 개수 확인 및 removeChild 자식 삭제 실시

/* =========================== */

[ 개발 환경 설정 ]

​

개발 툴 : Edit++

개발 언어 : javascript

/* =========================== */

​

/* =========================== */

[소스 코드]

 

    <script>
    	/* 
    	[요약 설명]
    	1. document.getElementById : 특정 태그 id 를 지정할 때 사용합니다    
    	2. childElementCount : 특정 태그에 포함된 자식 개수를 확인합니다
    	3. removeChild : 특정 태그에 포함된 자식을 삭제합니다
    	*/
    	    	
    	
    	/* 이벤트 함수 정의 */
    	function main() {    		
    		    		
    		/* 특정 태그 id 지정 실시 */    		
    		var parentTag = document.getElementById("main_container");
    		console.log("태그 ID : main_container");
    		
    		/* 특정 태그 id에 포함된 자식 노드 개수 확인 */    		
    		var int_one_count = parentTag.childElementCount;
    		console.log("자식 개수 : " + int_one_count);
    		
    		/* 특정 태그에 포함된 자식 레이아웃 모두 지우기 실시 */
    		var parentTag = document.getElementById("main_container"); 
    		while ( parentTag.hasChildNodes() ) { 
    			parentTag.removeChild( parentTag.firstChild ); 
    		};
    		
    		/* 특정 태그 id에 포함된 자식 노드 개수 확인 */    		
    		var int_two_count = parentTag.childElementCount;
    		console.log("자식 개수 : " + int_two_count);
    	};  	    	    	
    	
    </script>

/* =========================== */

​

/* =========================== */

[결과 출력]

​

​

​

/* =========================== */

​

/* =========================== */

[요약 설명]

​

/*

[요약 설명]

1. document.getElementById : 특정 태그 id 를 지정할 때 사용합니다

2. childElementCount : 특정 태그에 포함된 자식 개수를 확인합니다

3. removeChild : 특정 태그에 포함된 자식을 삭제합니다

*/

/* =========================== */