كما هو موضح أدناه:
انسخ رمز الكود كما يلي:
// أضف صفوفًا ديناميكيًا
وظيفة إضافة الصف () {
var table = document.getElementById("tableID");
var newRow = table.insertRow(); // أنشئ صفًا جديدًا
var newCell1 = newRow.insertCell(); // أنشئ خلية جديدة
newCell.innerHTML = ""; // المحتوى داخل الخلية
newCell.setAttribute("align"،"center")؛ // تعيين الموضع
}
// حذف الصفوف ديناميكيًا
وظيفة حذف الصف () {
varrowIndex = events.srcElement.parentElement.parentElement.rowIndex;
أنماط var = document.getElementById("tableID");
style.deleteRow(rowIndex);
}
<أتش تي أم أل>
<الرأس>
<العنوان></العنوان>
</الرأس>
<الجسم>
<معرف الجدول = "testTbl" الحدود = 1>
<تر>
<TD>
اسم المنتج
</TD>
<TD>
كمية المنتج
</TD>
<TD>
سعر وحدة المنتج
</TD>
</tr>
<تر>
<TD>
<اختر الاسم = "أ">
<option value="Electronic">إلكترونية</option>
<option value="الأجهزة الكهربائية">الأجهزة الكهربائية</option>
</select></td>
<TD>
<نوع الإدخال = "نص" الاسم = "ب">
</TD>
<TD>
<نوع الإدخال = "نص" اسم = "ج">
</TD>
</TD>
</الجدول>
<نوع الإدخال = "زر" اسم = "إرسال 2" قيمة = "إضافة" عند النقر = "addRow ()">
<النص البرمجي>
وظيفة إضافة الصف () {
// إضافة صف
var newTr = testTbl.insertRow();
// إضافة عمود
var newTd0 = newTr.insertCell();
var newTd1 = newTr.insertCell();
var newTd2 = newTr.insertCell();
var newTd3 = newTr.insertCell();
// قم بتعيين محتوى العمود وسماته
newTd0.innerText = document.all("a").options[document.all("a").selectedIndex].text;
newTd1.innerText = document.all("b").value;
newTd2.innerText = document.all("c").value;
newTd3.innerHTML= '<input type = "button" name = "del" value = "Delete" onclick = "del(this)">';
}
دالة (س)
{
var t=document.getElementById('testTbl');
t.deleteRow(o.parentNode.parentNode.rowIndex)
}
</script>
</الجسم>
</html>