[DHTML] 이미지 동적 생성하는 간단한 예제

<script language="JavaScript">
<!--
	function make(){
		var img = document.createElement('img'); // 이미지 객체 생성

		var rnd = Math.round(Math.random() * 20) + 1; // 이미지 랜덤하게 보여주기 위한 ..
		if(rnd < 10)rnd = '0' + rnd;

		img.onclick = function(){document.getElementById('board').removeChild(this)}; // 이미지를 클릭하면 제거되는 onclick 함수 생성
		img.src = 'http://superkts.pe.kr/images/helper/smp_180_' + rnd + '.jpg'; // 이미지 경로 설정 (랜덤)
		img.style.cursor = 'pointer'; // 커서 지정
		document.getElementById('board').appendChild(img); // board DIV 에 이미지 동적 추가
	}

	function del(){
		document.getElementById('board').innerHTML = '';
	}
//-->
</script>

이미지 생성 버튼을 클릭하면 이미지가 생성됩니다.<br>
이미지 전체제거 버튼을 클릭하면 생성된 이미지가 전체제거 됩니다.<br>
생성된 이미지를 클릭하면 그 이미지가 제거됩니다.<br><br>
<input type="button" value=" 이미지 생성 " onclick="make()"> <input type="button" value=" 이미지 전체제거 " onclick="del()">
<div id="board" style="width:720"></div>