Mēneša un gada attēlošana kalendārā JavaScript

Iepriekšējās nodarbībās mēs ar jums izveidojām to kalendāru, kurš bija paraugs pirmajā nodarbībā. Tagad papildināsim to.

Sākumā izveidosim tā, lai virs kalendāra tiktu rādīts pašreizējais mēnesis un gads. Ieviesīsim atbilstošās izmaiņas HTML kodā:

html<div id="parent">
  <div id="calendar">
    <div class="info">Jan 2020</div>
    <table>
      <thead>
        <tr>
          <th>pn</th>
          <th>ot</th>
          <th>tr</th>
          <th>ce</th>
          <th>pk</th>
          <th>se</th>
          <th>sv</th>
        </tr>
      </thead>
      <tbody class="body"></tbody>
    </table>
  </div>
</div>

Ieviesīsim arī izmaiņas CSS kodā:

css#parent {
  text-align: center;
}
#calendar {
  display: inline-block;
}
#calendar td, #calendar th {
  padding: 10px;
  border: 1px solid black;
  text-align: center;
}

#calendar .info {
  text-align: center;
}