Bagaimana untuk Membuat Struktur Jadual Tersuai dengan Javascript?

Membuat Struktur Jadual Tertentu Menggunakan JavaScript

Permintaan anda melibatkan mencipta jadual dengan struktur unik, berbeza daripada yang anda sediakan dalam kod anda. Untuk mencapai matlamat ini, mari kita terokai versi diubah suai fungsi JavaScript anda:

<code class="javascript">function createTable() {
  // Get the body element for table insertion
  var body = document.querySelector("body");

  // Create the table and table body elements
  var table = document.createElement("table");
  table.style.width = "100%";
  table.style.border = "1px solid black";
  var tableBody = document.createElement("tbody");

  // Set up the table rows and columns
  for (var i = 0; i < 3; i++) {
    var row = tableBody.insertRow();
    for (var j = 0; j < 2; j++) {
      if (i === 2 && j === 1) {
        // Skip cell for the bottom right corner
        continue;
      } else {
        var cell = row.insertCell();
        cell.appendChild(document.createTextNode(`Cell at row ${i}, column ${j}`));
        cell.style.border = "1px solid black";
        if (i === 1 && j === 1) {
          // Set a rowspan of 2 for the specific cell
          cell.setAttribute("rowspan", "2");
        }
      }
    }
  }

  // Append the table body to the table
  table.appendChild(tableBody);

  // Append the table to the body of the page
  body.appendChild(table);
}

createTable();</code>

Dalam kod yang diubah suai ini, kami menggunakan kaedah insertRow() dan insertCell() untuk mencipta baris dan sel jadual secara langsung. Perbezaan utama dan pengoptimuman termasuk:

• Menggunakan penggayaan CSS untuk menetapkan lebar dan jidar jadual dan bukannya atribut jidar pada elemen jadual.
• Mencipta rentang baris 2 untuk sel dalam baris kedua dan lajur kedua.
• Melangkau penciptaan sel untuk penjuru kanan sebelah bawah di mana tiada sel diperlukan.
• Menggunakan konvensyen penamaan yang konsisten untuk pembolehubah (camelCase) untuk kejelasan.

Atas ialah kandungan terperinci Bagaimana untuk Membuat Struktur Jadual Tersuai dengan Javascript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!