JavaScriptでHTMLテーブルを作成する関数

それでは、指定されたサイズのテーブルを作成し、指定された要素の末尾に追加する関数 createTableを作成しましょう。

この関数の最初のパラメータを行数、 2番目のパラメータを列数、 3番目のパラメータをテーブルを作成する DOM要素への参照として受け取ることにします。

作成された関数をどのように使用するか見てみましょう。例えば、次のようなdiv要素があるとします：

<div id="elem"></div>

このdiv要素内に3行4列のテーブルを作成しましょう：

let div = document.querySelector('#elem');
createTable(3, 4, div);

次に、2つのdiv要素があるとします：

<div id="elem1"></div>
<div id="elem2"></div>

これらの各div要素にそれぞれテーブルを作成しましょう：

let div1 = document.querySelector('#elem1');
createTable(3, 4, div1);

let div2 = document.querySelector('#elem2');
createTable(5, 6, div2);

作成されたテーブルがすぐに見えるようにするために、次のようなCSSを追加できます：

td {
	width: 50px;
	height: 50px;
	border: 1px solid black;
}

説明された関数の雛形は次のとおりです：

function createTable(rows, cols, parent) {
	let table = document.createElement('table');
	
	// ここでrows行、cols列のテーブルを作成します
	for () {
		for () {
			
		}
	}
	
	parent.appendChild(table);
}

上記の関数の雛形のコードを完成させてください。完成した関数の動作をテストしてください。