如何使用 Javascript 建立自訂表結構？

使用JavaScript 建立特定的表格結構

您的要求涉及建立一個具有獨特結構的表，該結構與您在中提供的結構不同你的程式碼。為了實現這一點，讓我們探索 JavaScript 函數的修改版本：

<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>

在此修改後的程式碼中，我們利用 insertRow() 和 insertCell() 方法直接建立表格行和單元格。主要區別和最佳化包括：

• 使用 CSS 樣式設定表格寬度和邊框，而不是表格元素上的邊框屬性。
• 為儲存格建立 2 的行跨度在第二行第二列。
• 跳過右下角不需要儲存格的儲存格建立。
• 為了清楚起見，使用一致的變數命名約定（駝峰命名法）。

以上是如何使用 Javascript 建立自訂表結構？的詳細內容。更多資訊請關注PHP中文網其他相關文章！