114. (javascript/자바스크립트) childNodes 자식 리스트 확인 및 자식...

114. (javascript/자바스크립트) childNodes 자식 리스트 확인 및 자식...

728x90

반응형

[개발 환경 설정]

개발 툴 : Edit++

개발 언어 : javascript

[소스코드]

/* [JS 요약 설명] 1. window onload : 웹 브라우저 로딩 완료 상태를 나타냅니다 2. childNodes : 특정 태그에 포함된 자식 노드 리스트를 가져옵니다 3. childList[i].nodeName.toLowerCase() : 특정 자식 노드 태그 속성 값을 영문 소문자로 반환합니다 4. childList[i].style.backgroundColor : 특정 자식 노드 배경 색상을 지정합니다 */ /* [html 최초 로드 및 이벤트 상시 대기 실시] */ window.onload = function() { console.log(""); console.log("[window onload] : [start]"); console.log(""); // 일반 이벤트 수행 함수를 호출 runFunction(); }; /* [이벤트 수행 함수] */ function runFunction(){ console.log(""); console.log("[runFunction] : [start]"); console.log(""); // 특정 객체에 포함된 자식 노드 리스트 지정 var childList = document.getElementById("multi_container").childNodes; // for 반복문을 수행하면서 자식 노드 특정 태그 개수 확인 실시 var divCount = 0; for (var i=0; i

[결과 출력]

[요약 설명]

/*

[JS 요약 설명]

1. window onload : 웹 브라우저 로딩 완료 상태를 나타냅니다

2. childNodes : 특정 태그에 포함된 자식 노드 리스트를 가져옵니다

3. childList[i].nodeName.toLowerCase() : 특정 자식 노드 태그 속성 값을 영문 소문자로 반환합니다

4. childList[i].style.backgroundColor : 특정 자식 노드 배경 색상을 지정합니다

*/

728x90

반응형

from http://kkh0977.tistory.com/1102 by ccl(A) rewrite - 2021-08-12 11:00:23