2016-11-13 1 views
1

달력을 만들려고하는데 1에서 30 또는 31까지의 날짜를 달에 따라 인쇄하고 싶습니다. 그리고 그 총 일수는 변수 totalDays입니다. 중첩 루프에서 trtd 년대를 생성하지만, 일을 채우기 위해 30셀 안에 모든 날짜를 인쇄하는 방법

var date = new Date('11/13/2016'); 

     var totalDays = new Date(date.getFullYear(), date.getMonth() + 1, 0); 

     var daysArr = ['M', 'T', 'W', 'T', 'F', 'S', 'S']; 

     totalDays = totalDays.getDate();   

     var table = document.createElement('table'); 


     for (var i = 0; i <= 5+1; i++) { 

      var tr = table.insertRow(i); 

      for(var ii = 0; ii <= 7-1; ii++){ 
       var td = tr.insertCell(ii); 
       td.innerHTML = (ii); 


      } 
     } 

     console.log(table); 
+0

루프 길이를위한 2 개는 동일하다. 다만 1 개의 루프를 제거하십시오 – prasanth

답변

0

1에서 각 td 내부 값을 출력하는 방법을 잘하지, 당신은 시도 할 수 있습니다이 하나

var date = new Date('11/13/2016'), 
 
    totalDays = new Date(date.getFullYear(), date.getMonth() + 1, 0), 
 
    // i changed the order to synchronize with getDay() in js => Sun = 0 
 
    daysArr = ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'], 
 
    table = document.createElement('table'), 
 
    row = 0, 
 
    d = 1, 
 
    h = new Date(date.setDate(1)); 
 

 
totalDays = totalDays.getDate(); 
 
h = h.getDay(); 
 

 
while (d <= totalDays + daysArr.length) { 
 
    var tr = table.insertRow(row); 
 
    for (var ii = 0; ii < daysArr.length; ii++) { 
 
    if (d > totalDays + daysArr.length) { 
 
     break; 
 
    } 
 
    var td = tr.insertCell(ii); 
 
    if (d <= daysArr.length) { 
 
     //filling the Header for calendar 
 
     td.innerHTML = daysArr[h]; 
 
     d++; 
 
     if (h >= daysArr.length - 1) { 
 
     h = 0; 
 
     } else { 
 
     h++ 
 
     } 
 
    } else { 
 
     //filling the dates 
 
     td.innerHTML = d++ - daysArr.length; 
 
    } 
 
    } 
 
    row++; 
 
} 
 

 

 
document.body.appendChild(table); 
 
console.log('Total Days this month:', totalDays);

물론 귀하의 캘린더 프로젝트에는 아직 완료되지 않았습니다. 그러나이 도움을 희망하십시오

관련 문제