Question

I am trying to print a yearly calendar on one page using JS. This specifically seems to be the function giving me issues. Let me know if you could point me in the right direction, or if I can provide more info. Thanks

function yearly(calDate)    {
    if (calDate == null) calendarDay = new Date();
    else calendarDay = new Date(calDate)

    var currentTime = calendarDay.getTime();
    var thisYear = calendarDay.getFullYear();

    <table id='yearly_table'><tr>
        <th id='yearly_title' colspan='4'>
        thisYear;
    </th>
    </tr>
    var monthNum=-1;

    for (var i=1;i<=3;i++)  {
        document.write("<tr>");
    for (var j=1;j<=4;j++) {
        monthNum=monthNum++;
        calendarDay.setDate(1);
        calendarDay.setMonth(monthNum);
        writeMonthCell(calendarDay, currentTime);
    }
    <"</tr>">
    }
}

Answer 1

You can’t put html into a javascript function like that. Javascript can only contain javascript statements, no html tags. The browser will try to execute your html as being javascript statements and won’t recognise any of it.

You need to insert it into the DOM. Use methods like getElementById, createElement and appendChild. More info here

For example, to write some text to an element you do this:

// get the element using it's ID
var element = document.getElementById("myElementId");

// create a child element
var newElement = document.createTextNode("This is my text");

// write some text into it
element.appendChild(newElement);

You can see the example run here