8장실습문제 1, 3, 5, 10번을 제출하기 바랍니다.
10.
<!DOCTYPE html><html><head><meta charset="UTF-8"><title>DOM 객체 동적 삽입</title><script src ="JS_CSS/10.js"></script></head><body><h3>정답의 동적 삽입</h3><hr><div><p>Q. 거울아 거울아 세상에서 누가 제일 예쁘니?</p><button onclick="addAnswer(this, '백설공주')"> 답보기 </button></div><div><p>Q. 죽느냐 사느냐 어떤 것이 문제인가?</p><button onclick="addAnswer(this, '둘다')"> 답보기 </button></div></body></html>10.jsfunction addAnswer(obj, text){var object = obj.parentElement;var newP = document.createElement("p"); //p태그 생성if(obj != object.lastElementChild) //마지막 자식이 아니면 리턴return;else{newP.innerHTML = text; //마지막이면 text를 생성object.appendChild(newP);}newP.onclick = function() //text를 눌렀을 때 제거{var p = this.parentElement; // 부모 HTML 태그 요소p.removeChild(this); // 자신을 부모로부터 제거};
'대학교 > 2.웹프로그래밍' 카테고리의 다른 글
[명품 웹 프로그래밍] 10장 연습문제 (1) | 2017.06.03 |
---|---|
[명품 웹 프로그래밍] 9장 연습문제 //html 계산기 만들기 (0) | 2017.06.03 |
[명품 웹 프로그래밍] 7장 연습문제 (0) | 2017.06.03 |
[명품 웹 프로그래밍] 6장 open challenge (1) | 2017.06.03 |
[명품 웹 프로그래밍] 3장 open challenge (5) | 2017.06.03 |