طريقة Table insertRow()

HTML DOM Table عائلة الأوبجكت

التعريف والاستخدام

insertRow() يخلق الطريقة صفًا فارغًا عنصر <tr> وأضعه في الجدول.

insertRow() يضيف الطريقة إلى الموقع المحدد في الجدول صفًا جديدًا.

ملاحظة:عنصر <tr> يجب أن يحتوي على عنصر <th> أو <td>.

نصيحة:استخدم: طريقة deleteRow() حذف صف.

انظر أيضًا:

دليل HTML:HTML <tr> الوسم

مثال

مثال 1

أدرج صفًا جديدًا في الموقع الأول من الجدول (وأدرج عنصر <td> يحتوي على محتوى):

// ابحث عن عنصر <table> الذي يحتوي على id="myTable":
var table = document.getElementById("myTable");
// أنشئ عنصر <tr> فارغًا وأضعه في الموقع الأول من الجدول:
var row = table.insertRow(0);
// أدرج خلايا جديدة (عناصر <td>) في الموقع الأول والثاني من العنصر <tr> الجديد:
var cell1 = row.insertCell(0);
var cell2 = row.insertCell(1);
// أضف نصًا إلى الخلية الجديدة:
cell1.innerHTML = "NEW CELL1";
cell2.innerHTML = "NEW CELL2";

جرب بنفسك

مثال 2

إنشاء وإزالة الصفوف:

function myCreateFunction() {
  var table = document.getElementById("myTable");
  var row = table.insertRow(0);
  var cell1 = row.insertCell(0);
  var cell2 = row.insertCell(1);
  cell1.innerHTML = "NEW CELL1";
  cell2.innerHTML = "NEW CELL2";
}
function myDeleteFunction() {
  document.getElementById("myTable").deleteRow(0);
}

جرب بنفسك

النحو

tableObject.insertRow(index)
الم 参数 الوصف
index

مطلوب في Firefox و Opera، خياري في IE و Chrome و Safari.

الرقم، يحدد موقع السطر الذي سيتم إدراجه (من البداية). القيمة 0 تجعل السطر الجديد يتم إدراجه في الموقع الأول.

يمكن أيضًا استخدام القيمة -1، مما يؤدي إلى إدراج سطر جديد في آخر موقع.

إذا تم تجاهل هذا المعامل، فإن insertRow() يضيف سطرًا جديدًا في آخر موقع في Chrome وIE وFirefox وOpera، وفي الموقع الأول في Safari.

تفاصيل التقنية

القيمة الم返回ة: النص العنواني <tr> المدمج.

دعم المتصفحات

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
الدعم الدعم الدعم الدعم الدعم

HTML DOM Table عائلة الأوبجكت