Lịch bằng JavaScript

Trong phần này, chúng ta sẽ thực hiện một lịch. Để đơn giản, chúng ta sẽ làm sao cho lịch hiển thị cho tháng hiện tại. Nhưng với ý định là có thể phát triển thêm để có thể thay đổi tháng và năm. Đây là mẫu của những gì chúng ta sẽ đạt được:

Đây là bố cục HTML mà bạn có thể sử dụng khi giải quyết nhiệm vụ:

<div id="parent">
	<div id="calendar">
		<table>
			<thead>
				<tr>
					<th>Thứ 2</th>
					<th>Thứ 3</th>
					<th>Thứ 4</th>
					<th>Thứ 5</th>
					<th>Thứ 6</th>
					<th>Thứ 7</th>
					<th>Chủ nhật</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;
}

Ngay bây giờ, hãy lấy tham chiếu đến tất cả các thẻ cần thiết vào các biến, và cũng ghi lại tháng và năm hiện tại:

let calendar = document.querySelector('#calendar');
let body = calendar.querySelector('.body');

let date  = new Date();
let year  = date.getFullYear();
let month = date.getMonth();

Hãy sao chép các đoạn mã tôi đã cung cấp cho bạn.