JavaScript로 HTML 테이블 생성하기

다음과 같은 빈 HTML 테이블이 있다고 가정해 보겠습니다:

<table id="table"></table>

이 테이블을 행과 열로 채워 봅시다. 다음은 우리가 얻어야 할 결과의 예입니다:

<table id="table">
	<tr>
		<td></td>
		<td></td>
		<td></td>
	</tr>
	<tr>
		<td></td>
		<td></td>
		<td></td>
	</tr>
	<tr>
		<td></td>
		<td></td>
		<td></td>
	</tr>
</table>

이 문제를 해결하려면 두 개의 중첩된 루프가 필요합니다. 첫 번째 루프는 테이블의 행을 생성하고, 두 번째 루프는 각 행의 셀을 생성합니다:

let table = document.querySelector('#table');

for (let i = 0; i < 3; i++) {
	let tr = document.createElement('tr');
	
	for (let i = 0; i < 3; i++) {
		let td = document.createElement('td');
		tr.appendChild(td);
	}
	
	table.appendChild(tr);
}

빈 HTML 테이블이 주어졌습니다. 두 개의 중첩된 for 루프를 사용하여 이 테이블을 5개의 행과 5개의 열로 채우세요.

이전 문제를 수정하여 테이블이 10개의 행과 5개의 열 크기로 생성되도록 하세요.

이전 문제를 수정하여 각 td에 텍스트 'x'가 추가되도록 하세요.

테이블 생성기를 구현하세요. 테이블의 너비와 높이는 두 개의 입력 필드(예: 5행 10열 테이블)로 설정됩니다.