본문 바로가기
  • think normal
새로워지기/서른의 생활코딩

샘플소스2) javascript 기본 문서구조 ( 문제1 )

by 청춘만화 2011. 4. 8.



문제 1 : 1~25까지의 연속된 숫자로 되어있는 5*5 테이블 만들기
 


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"


"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">


<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ko" lang="ko">




<head>


<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=UTF-8" />


<title> 문제 1 </title>


</head>




<body>


<script type="text/javascript">


//<!CDATA[




/* 




for(i=1;i<=25;i++){




if(i%5==1){


document.write("<br />");


}


document.write("<td>" + i + "</td>");


}




/// -> 


document.write("<table border=1>");




for(i=1;i<=25;i++){




if(i%5==1){


document.write("<tr>");


}




document.write("<td>" + i + "</td>");




if(i%5==0){


document.write("</tr>");


}


}




document.write("</table>");




// 티쳐 : 의미 없는 tr이 반복되어 생성되늰 단점이있다.


*/


str1 = "<table border='1' width='150px' height='150px'>";


str1 += "<tr>";




//alert(str1);




for(i=1;i<=25;i++){


str1 += "<td>" + i + "</td>";


if(i%5==0){


str1 += "<tr>";


str1 +="</tr>";


}


}


str1 +="</table>";


document.write(str1);








//]]]]>


</script>




<br />


<table>


<tr>


<td>1</td><td>3</td><td>5</td>


</tr>


<tr>


<td>1</td><td>3</td><td>5</td>


</tr>


</table>






</body>


</html>

댓글