JavaScript တွင် HTML ဇယားများဖန်တီးရန်အတွက် Function

ယခု <createTable> function တစ်ခုကိုဖန်တီးကြပါစို့။ ထို function သည် သတ်မှတ်ထားသောအရွယ်အစားရှိ ဇယားတစ်ခုကိုဖန်တီးပြီး သတ်မှတ်ထားသော element ၏အဆုံးတွင်ထည့်သွင်းပေးမည်ဖြစ်သည်။

ကျွန်ုပ်တို့၏ function သည် ပထမသတ်မှတ်ချက် (parameter) အဖြစ် အတန်းအရေအတွက်၊ ဒုတိယသတ်မှတ်ချက်အဖြစ် ကော်လံအရေအတွက်၊ တတိယသတ်မှတ်ချက်အဖြစ် ကျွန်ုပ်တို့၏ဇယားကိုဖန်တီးမည့် DOM element သို့ လင့်ခ်ကိုလက်ခံရရှိပါစေ။

ဖန်တီးပြီးသောအခါ ဖော်ပြထားသော function ကို မည်သို့အသုံးပြုမည်ကို ကြည့်ရှုကြပါစို့။ ဥပမာအားဖြင့်၊ ကျွန်ုပ်တို့တွင် အောက်ပါ div တစ်ခုရှိသည်ဟုဆိုကြပါစို့။

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

ဤ div ၏အတွင်းတွင် <3> x <4> ဇယားတစ်ခုကိုဖန်တီးကြပါစို့။

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

ယခု ကျွန်ုပ်တို့တွင် 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 ၏ အခြေခံအဆောက်အအုံ ရှိပါသည်။

function createTable(rows, cols, parent) {
	let table = document.createElement('table');
	
	// ဤနေရာတွင် rows အတန်းများနှင့် cols ကော်လံများပါသော ဇယားတစ်ခုကိုဖန်တီးမည်။
	for () {
		for () {
			
		}
	}
	
	parent.appendChild(table);
}

အထက်တွင်ဖော်ပြထားသော function ၏ အခြေခံအဆောက်အအုံကို ပြီးပြည့်စုံအောင်ရေးသားပါ။ ပြီးစီးသော function ၏လုပ်ဆောင်ချက်ကို စမ်းသပ်ကြည့်ပါ။