为什么我在 div JavaScript 中得到额外的正斜杠

Why am I getting extra forward slashes in the div JavaScript

出于某种原因,我在动态填充的日历的 header 之后在各自的行上呈现了 8 个正斜杠。它的基本代码如下:

<script type="text/javascript">
    function getCalendar() {
        var now = new Date();
        var thisMonth = now.getMonth();
        var months = ['January','February','March','April','May','June','July','August','September','October','November','December'];
        var month = months[now.getMonth()];
        var thisYear = now.getFullYear();
        var firstDay = new Date(thisYear, thisMonth, 1, 0, 0, 0, 0);
        var firstDayOfWeek = firstDay.addDays(-firstDay.getDay()); // get the first date of the 5-week calendar
        var calendar = '<header> <h1 class="month-year">' + month + '&nbsp;&nbsp;&nbsp;&nbsp;' + thisYear + '</h1> ';
        calendar += '</header> <table> <tr> <th>Sun</th> <th>Mon</th> <th>Tue</th> <th>Wed</th> <th>Thu</th> <th>Fri</th> <th>Sat</th> </tr> ';
        var calMonth = new Array(6); // least amount that will contain an entire month every time
        calMonth[0] = new Array(7); // each week contains 7 days
        calMonth[1] = new Array(7);
        calMonth[2] = new Array(7);
        calMonth[3] = new Array(7);
        calMonth[4] = new Array(7);
        calMonth[5] = new Array(7);
        for(var i = 0; i < 6; i++) {
            for(var j = 0; j < 7; j++) {
                calMonth[i][j] = new Date(firstDayOfWeek); // input each date for the calendar into the array
                firstDayOfWeek = new Date(firstDayOfWeek.addDays(1));
            }
        }
        for(var i = 0; i < 6; i++) {
            calendar += '<tr>';
            for(var j = 0; j < 7; j++) {
            var currDate = new Date(calMonth[i][j]);
            day = currDate.getDate();
                if(day == now.getDate() && currDate.getMonth() == now.getMonth()) {
                    calendar += '<td class="moderate current-day">' + day + '</td>';
                } else if(currDate < now) {
                    calendar += '<td class="event heavy"><s>' + day + '</s></td>';
                } else if(currDate.getDay() >= 5) {
                    calendar += '<td class="light">' + day + '</td>/';
                } else if(currDate.getMonth() > now.getMonth() && currDate.getYear() == now.getYear()
                    || currDate.getMonth() < now.getMonth() && currDate.getYear() < now.getYear()) {
                    calendar += '<td class="event moderate next-month">' + day + '</td>';
                } else if(currDate.getMonth() < now.getMonth() && currDate.getYear() == now.getYear()
                    || currDate.getMonth() > now.getMonth() && currDate.getYear() > now.getYear()) {
                    calendar += '<td class="event heavy prev-month">' + day + '</td>';
                } else { calendar += '<td class="event light">' + day + '</td>'; }
            }
            calendar += '</tr>';
        }
        document.getElementById('calendar').innerHTML = calendar;
    }

    Date.prototype.addDays = function (n) {
        var time = this.getTime();
        var changedDate = new Date(time + (n * 24 * 60 * 60 * 1000));
        this.setTime(changedDate.getTime());
        return this;
}
</script>

当它呈现给 <div class='calendar' id='calendar'></div> 时,由于某种原因它填充 //////// 到 header 正下方的行,目前呈现 August 2015.

我在 header 和 table 的 body 之间没有任何东西,我在实际 div 中也没有任何东西,直到日历被渲染(在 onload 事件期间)。它的图像如下所示:

此外,可以在 this website.

查看具有当前样式的 in-progress 版本

谁能帮我解开这个谜?

谢谢,

-C§

您的 for 循环中标记后有一个偏离的正斜杠。下面已删除。

<script type="text/javascript">
function getCalendar() {
    var now = new Date();
    var thisMonth = now.getMonth();
    var months = ['January','February','March','April','May','June','July','August','September','October','November','December'];
    var month = months[now.getMonth()];
    var thisYear = now.getFullYear();
    var firstDay = new Date(thisYear, thisMonth, 1, 0, 0, 0, 0);
    var firstDayOfWeek = firstDay.addDays(-firstDay.getDay()); // get the first date of the 5-week calendar
    var calendar = '<header> <h1 class="month-year">' + month + '&nbsp;&nbsp;&nbsp;&nbsp;' + thisYear + '</h1> ';
    calendar += '</header> <table> <tr> <th>Sun</th> <th>Mon</th> <th>Tue</th> <th>Wed</th> <th>Thu</th> <th>Fri</th> <th>Sat</th> </tr> ';
    var calMonth = new Array(6); // least amount that will contain an entire month every time
    calMonth[0] = new Array(7); // each week contains 7 days
    calMonth[1] = new Array(7);
    calMonth[2] = new Array(7);
    calMonth[3] = new Array(7);
    calMonth[4] = new Array(7);
    calMonth[5] = new Array(7);
    for(var i = 0; i < 6; i++) {
        for(var j = 0; j < 7; j++) {
            calMonth[i][j] = new Date(firstDayOfWeek); // input each date for the calendar into the array
            firstDayOfWeek = new Date(firstDayOfWeek.addDays(1));
        }
    }
    for(var i = 0; i < 6; i++) {
        calendar += '<tr>';
        for(var j = 0; j < 7; j++) {
        var currDate = new Date(calMonth[i][j]);
        day = currDate.getDate();
            if(day == now.getDate() && currDate.getMonth() == now.getMonth()) {
                calendar += '<td class="moderate current-day">' + day + '</td>';
            } else if(currDate < now) {
                calendar += '<td class="event heavy"><s>' + day + '</s></td>';
            } else if(currDate.getDay() >= 5) {
                calendar += '<td class="light">' + day + '</td>';
            } else if(currDate.getMonth() > now.getMonth() && currDate.getYear() == now.getYear()
                || currDate.getMonth() < now.getMonth() && currDate.getYear() < now.getYear()) {
                calendar += '<td class="event moderate next-month">' + day + '</td>';
            } else if(currDate.getMonth() < now.getMonth() && currDate.getYear() == now.getYear()
                || currDate.getMonth() > now.getMonth() && currDate.getYear() > now.getYear()) {
                calendar += '<td class="event heavy prev-month">' + day + '</td>';
            } else { calendar += '<td class="event light">' + day + '</td>'; }
        }
        calendar += '</tr>';
    }
    document.getElementById('calendar').innerHTML = calendar;
}

Date.prototype.addDays = function (n) {
    var time = this.getTime();
    var changedDate = new Date(time + (n * 24 * 60 * 60 * 1000));
    this.setTime(changedDate.getTime());
    return this;
}
</script>