JavaScript-те календарь
Бұл бөлімде біз календарды жүзеге асырамыз. Қарапайымдылық үшін біз календардың ағымдағы ай үшін көрсетілетіндей етіп жасаймыз. Бірақ оны әзірлеп, ай мен жылды өзгертуге болатын етіп жасауға болады. Міне, біздің нәтижесіміздің үлгісі:
Міне, есепті шешу кезінде пайдалана алатын верстка:
<div id="parent">
<div id="calendar">
<table>
<thead>
<tr>
<th>дс</th>
<th>сс</th>
<th>ср</th>
<th>бс</th>
<th>жм</th>
<th>сб</th>
<th>жс</th>
</tr>
</thead>
<tbody class="body"></tbody>
</table>
</div>
</div>
#parent {
text-align: center;
}
#calendar {
display: inline-block;
}
#calendar td, #calendar th {
padding: 5px 12px;
border: 1px solid black;
text-align: center;
}
Бірден барлық қажетті тегтерге сілтемелерді айнымалы мәндерге алайық, сонымен қатар ағымдағы ай мен жылды жазып алайық:
let calendar = document.querySelector('#calendar');
let body = calendar.querySelector('.body');
let date = new Date();
let year = date.getFullYear();
let month = date.getMonth();
Мен ұсынған код дайындамаларын өзіңізге көшіріп алыңыз.