在Javascript中解析表

我正在尝试创建一个日历，以后可以使用CSS进行样式设置。下面是JS和HTML代码。还有一个CSS样式表，但它只是用于颜色和定位。在Javascript中，我希望根据每月的第一天和最后一天构建表，并在每个周末插入一行新行。实际上，Javascript什么也不做。删除第一条if语句时，它似乎只迭代一次。我不确定我在创建表格的过程中把事情搞砸了

function setDate() {
  var today = new Date();
  var year = today.getFullYear();
  var month = today.getMonth();
  var day = today.getDate();
  document.getElementById("myDay").value = day;
  document.getElementById("myMonth").value = month;
  document.getElementById("myYear").value = year;
}

function buildCalendar() {
  var firstDate = new Date(document.getElementById("myYear").value, document.getElementById("myMonth").value, 1);
  var weekDay = firstDate.getDay();
  var theDate = firstDate.getDate();
  var theMonth = firstDate.getMonth();
  var theYear = firstDate.getFullYear();
  var newDay = new Date(theYear, theMonth + 1, 1);
  var lastDate = new Date(newDay - 1);
  var lastDay = lastDate.getDate();
  document.write("<table class='caltable' border='1'><tr><th>");
  document.write("<tr><th>Sunday</th><th>Monday</th><th>Tuesday</th><th>Wednesday</th><th>Thursday</th><th>Friday</th><th>Saturday</th>");
  document.write("</th></tr>");
  var col = 0;
  for (var i = theDate; i < lastDay + 1; i++) {
    if (col == 0) {
      document.write("<tr><td>" + i "</td>");
    }
    if (col == 6) {
      document.write("<td>" + i + "</td></tr>");
      col == 0;
    } else {
      document.write("<td>" + i + "</td>");
      col++;
    }
  }


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

function getMonthName() {
  var e = getElementById("myMonth").selectedIndex;
  var monthName = e.options[e.selectedIndex].text;
  return monthName;
}

函数setDate（）{
var today=新日期（）；
var year=today.getFullYear（）；
var month=today.getMonth（）；
var day=today.getDate（）；
document.getElementById（“myDay”）.value=day；
document.getElementById（“myMonth”）.value=month；
document.getElementById（“myYear”）。值=年份；
}
函数buildCalendar（）{
var firstDate=新日期（document.getElementById（“myYear”）.value，document.getElementById（“myMonth”）.value，1）；
var weekDay=firstDate.getDay（）；
var theDate=firstDate.getDate（）；
var theMonth=firstDate.getMonth（）；
var theYear=firstDate.getFullYear（）；
var newDay=新日期（年、月+1,1）；
var lastDate=新日期（newDay-1）；
var lastDay=lastDate.getDate（）；
文件。填写（“”）；
文件。书写（“星期日星期二星期四星期五星期六”）；
文件。填写（“”）；
var-col=0；
对于（var i=日期；i<最后一天+1；i++）{
如果（列==0）{
文件。填写（“+i”）；
}
如果（列==6）{
文件。写（“+i+”）；
col==0；
}否则{
文件。写（“+i+”）；
col++；
}
}
文件。填写（“”）；
}
函数getMonthName（）{
var e=getElementById（“myMonth”）。选择索引；
var monthName=e.options[e.selectedIndex].text；
返回月名；
}

这是HTML文件。它基本上只是一个包装器div，其中包含一些其他div，用于保存日历（最终是一个调度器）以及当前日期。现在，我只是想让表（参见javascript）进行构建。理想情况下，它应该位于id为“bottomLeft”的div中。

提供头衔
左Div
右分区
显示日历
日期：月份：一月二月三月五月六月六月六月六月十月十月十月十二月：左上方的Div显示日期的表单组件
显示要添加任务的窗体
显示任务列表

您在Javascript代码中犯了一些错误

if (col == 6)
{
document.write("<td>" + i + "</td></tr>");
col == 0;  //this should be changed to col = 0; with col = 0; u set col to 0.
}

if（列==6）
{
文件。写（“+i+”）；
col==0；//这应该更改为col=0；col=0；u将col设置为0。
}

及

if（列==0）
{
文件。填写（“+i”）；
}

u应将其更改为：

if(col == 0)
{
document.write("<tr><td>" + i + "</td>"); // combine string with variable and string.
}

if（列==0）
{
document.write（“+i+”）；//将字符串与变量和字符串组合起来。
}

除了前面提到的错误Ceesie123456外，还需要从开始表标记字符串中删除额外的

。作为将日历放入左下角div的一种方法，可以使用set元素的innerHTML属性。最后，您缺少一条逻辑，该逻辑用于检查日历的结尾是否不是行的结尾，这意味着该表无法正确对齐。举个例子：

function buildCalendar(){
    var firstDate = new Date(document.getElementById("myYear").value, document.getElementById("myMonth").value, 1);
    var weekDay = firstDate.getDay();
    var theDate = firstDate.getDate();
    var theMonth = firstDate.getMonth();
    var theYear = firstDate.getFullYear();
    var newDay = new Date(theYear, theMonth + 1, 1);
    var lastDate = new Date(newDay - 1);
    var lastDay = lastDate.getDate();

    var tableString = ("<table class='caltable' border='1'>");
    tableString = tableString + ("<thead><tr><tr><th>Sunday</th><th>Monday</th><th>Tuesday</th><th>Wednesday</th><th>Thursday</th><th>Friday</th><th>Saturday</th></tr></thead>");
    tableString = tableString + "<tbody>";
    var col = 0;
    for (var i = theDate; i <= lastDay; i++)
    {
        if(col == 0)
        {
            tableString = tableString + ("<tr>");
        }
        tableString = tableString + "<td>" + i + "</td>";

        if (col == 6 || i == lastDay)
        {
            tableString = tableString + ("</tr>");
            col = 0;
        }
        else 
        {
            col++;
        }
    }

    tableString = tableString + ("</tbody></table>");
    document.getElementById("bottomLeft").innerHTML = tableString;
}

函数buildCalendar（）{
var firstDate=新日期（document.getElementById（“myYear”）.value，document.getElementById（“myMonth”）.value，1）；
var weekDay=firstDate.getDay（）；
var theDate=firstDate.getDate（）；
var theMonth=firstDate.getMonth（）；
var theYear=firstDate.getFullYear（）；
var newDay=新日期（年、月+1,1）；
var lastDate=新日期（newDay-1）；
var lastDay=lastDate.getDate（）；
变量表字符串=（“”）；
表字符串=表字符串+（“星期日星期二星期四星期五星期六”）；
表字符串=表字符串+“”；
var-col=0；
对于（var i=日期；我能解释一下您遇到的问题吗？
if(col == 0)
{
document.write("<tr><td>" + i + "</td>"); // combine string with variable and string.
}

function buildCalendar(){
    var firstDate = new Date(document.getElementById("myYear").value, document.getElementById("myMonth").value, 1);
    var weekDay = firstDate.getDay();
    var theDate = firstDate.getDate();
    var theMonth = firstDate.getMonth();
    var theYear = firstDate.getFullYear();
    var newDay = new Date(theYear, theMonth + 1, 1);
    var lastDate = new Date(newDay - 1);
    var lastDay = lastDate.getDate();

    var tableString = ("<table class='caltable' border='1'>");
    tableString = tableString + ("<thead><tr><tr><th>Sunday</th><th>Monday</th><th>Tuesday</th><th>Wednesday</th><th>Thursday</th><th>Friday</th><th>Saturday</th></tr></thead>");
    tableString = tableString + "<tbody>";
    var col = 0;
    for (var i = theDate; i <= lastDay; i++)
    {
        if(col == 0)
        {
            tableString = tableString + ("<tr>");
        }
        tableString = tableString + "<td>" + i + "</td>";

        if (col == 6 || i == lastDay)
        {
            tableString = tableString + ("</tr>");
            col = 0;
        }
        else 
        {
            col++;
        }
    }

    tableString = tableString + ("</tbody></table>");
    document.getElementById("bottomLeft").innerHTML = tableString;
}