-
[javascript] 57. DOM HTML - 자바스크립트 강좌 JS / CSEWeb/JavaScript 2015. 6. 13. 15:37
JavaScript HTML DOM - Changing HTML
HTML DOM은 HTML 요소의 내용을 변경 할 수 있게 자바스크립트에게 허용합니다.
1. Changing the HTML Output Stream
자바스크립트는 동적인 HTML 내용을 만들 수 있습니다.
document.write()는 HTML 출력 스트림을 직접 작성하는 것 입니다.
1234567891011<!DOCTYPE html><html><body><script>document.write(Date());</script></body></html>cs * 문서가 로드가 된 후, document.write()를 사용하지 마세요. 문서에 덮어쓰게 됩니다.
2. Changing HTML Content
HTML 요소의 내용을 바꿀때, 아래 문법을 사용합니다.
document.getElementById(id).innerHTML = new HTML3. Changing the Value of an Attribute
HTMl 요소의 값을 바꾸기 위해서는 아래 문법을 사용합니다.
document.getElementById(id).attribute=new value아래 예제는 <img> 요소의 src 속성을 변경하는 예제 입니다:
12345678910111213<!DOCTYPE html><html><body><img id="myImage" src="smiley.gif"><script>document.getElementById("myImage").src = "landscape.jpg";</script></body></html>cs 'Web > JavaScript' 카테고리의 다른 글
[javascript] 60. DOM Event Listener - 자바스크립트 강좌 JS / CSE (0) 2015.06.13 [javascript] 59. DOM Event - 자바스크립트 강좌 JS / CSE (0) 2015.06.13 [javascript] 58. DOM CSS - 자바스크립트 강좌 JS / CSE (0) 2015.06.13 [javascript] 56. DOM 요소(DOM elements) - 자바스크립트 강좌 JS / CSE (0) 2015.06.13 [javascript] 55. DOM 문서(DOM document) - 자바스크립트 강좌 JS / CSE (0) 2015.06.13 [javascript] 54. DOM 메소드(DOM method) - 자바스크립트 강좌 (0) 2015.06.13