1006_JavaScript : DOM (Document Object Model) 문서 객체 모델

1006_JavaScript : DOM (Document Object Model) 문서 객체 모델

Insert title here

자식수 : " + div.childNodes.length; // 7 // console.log(div.childNodes); // 자식 노드 정보(children:태그만) str += "

자식수 : " + div.children.length; // 3 // console.log(div.children); // [p, p, p] alert(str); } // 노드를 마지막에 추가 function sub2() { var div = document.getElementById("layout"); var node = document.createElement("p"); node.setAttribute("onclick", "fun();"); // click 이벤트 추가 var textNode = document.createTextNode("마지막!!!"); node.appendChild(textNode); div.appendChild(node); } // 노드를 특정 노드 앞에 추가 function sub3() { var div = document.getElementById("layout"); var node = document.createElement("p"); var textNode = document.createTextNode("앞!!!"); node.appendChild(textNode); div.insertBefore(node, div.childNodes[0]); // div.insertBefore(node, div.childNodes[1]); // div.insertBefore(node, div.children[1]); } // 노드 삭제 function sub4() { var div = document.getElementById("layout"); if(div.childNodes.length > 1) { div.removeChild(div.childNodes[1]); } } // 스타일 없애기 function sub5() { var div = document.getElementById("layout"); // div.style.border = "none"; div.style.removeProperty("border"); } // 처음 p 태그 세개를 클릭하면 요소의 text 값 가져오기 window.onload = function() { var ps = document.getElementById("layout").children; for(var i=0; i 노드 추가 및 삭제 자바 안드로이드 프레임워크 노드정보 노드추가 특정노드앞에추가 노드삭제 스타일없애기

- 노드 정보

- 노드 추가

- 특정 노드 앞에 추가

- 노드 삭제

- 스타일 없애기 (스타일 속성의 border 프로퍼티 없애기)

from http://development-writing.tistory.com/315 by ccl(S) rewrite - 2021-10-07 03:00:59