학원/JS

11/1 33-2 [JS] forWhile로 구구단 출력하기

도원결의 2022. 11. 1. 18:03

올 것이 왔구나 구구단단단단단단ㄷ

 

테이블로 넣어서 출력하는 방법이 2가지가 있음

잘... 공부 해 놓자!!

어디서 tr 랑 td 들어가는지 그리고 스타일 주는 법도 헷깔리지 않게 잘자자잘!!!

그리고 구구단 배웠으니까 10월 학습에 span 에다가 구구단도 추가 해 넣기 !!!

 

방법1

document.write('<h2> for문으로 구구단 출력</h2>')
document.write("<table style='text-align:center;width:600px; background-color: black; border-spacing: 1px; width: 50; height: 50;'>");
  for( i=1 ; i<=9 ; i++ ){
     document.write("<tr style = 'background-color:white';>")
        for( k=2 ; k<=9 ; k++){
            document.write("<td>"+k+" * "+i+" = "+k*i+"</td>");
         }
      document.write('</tr>');
  }  
 document.write("</table>");

 

방법2(이거 잘 봐둬! table을 누적해서 담는 방법이랫!!!)

화면에 출력하는 태그들을 table변수로 담고 누적해서 마지막에 한꺼번에 호출!

document.write('<h2> for문으로 구구단 출력 다른 방법!</h2>')
var table ="<table style='text-align:center;width:700px; background-color: black; border-spacing: 1px; width: 50; height: 50;'>"              
   for( i=1 ; i<=9 ; i++ ){
       table += "<tr style = 'background-color:white';>"
            for( k=2 ; k<=9 ; k++){
                table +="<td>"+k+" * "+i+" = "+k*i+"</td>"
             }
        table += "</tr>"
    }       
 table += "</table>"
document.write(table);