Заполнить таблицу на половину по диагонали

Question

Необходимо заполнить таблицу следующим образом: Я создал таблицу. Взял ряд, из которых достал ячейки. Сделал "пирамидку". Просчитался, но где)

let table = document.querySelector("table");
for (let i = 0; i < 5; i++) {
  let newTr = document.createElement("tr");
  table.append(newTr);
  for (let j = 1; j <= 5; j++) {
    let newTd = document.createElement("td");
    newTr.append(newTd);
  }
}

let allTr = document.querySelectorAll("tr");
var output = "";
for (const tr of allTr) {
for (const td of tr.children) {

  for (let i = tr.children.length; i>=1; i--) {
          for (var j = 1; j <= i; j++) {
            output = 'x'
          }
          td.textContent =  output;
      }
    }
}

 table {
    width: 100%;
    margin-bottom: 20px;
    /* border: 1px solid black; */
    /* border-collapse: collapse;  */
  }
  table tr {
    font-weight: bold;
    padding: 5px;
    border: 1px solid black;
  }
  table td {
    border: 1px solid black;
    padding: 5px;
    height: 40px;
  }

  <table></table>

Answer 1

Заполнить таблицу на половину по диагонали

Предложу такой вариант...

const n = 5
const table = document.querySelector("table");
for (let i = 0; i < n; i++) {
  const newTr = document.createElement("tr");
  table.append(newTr);
  for (let j = 1; j <= n; j++) {
    const newTd = document.createElement("td");
    if (j <= n - i) newTd.textContent = 'X'
    newTr.append(newTd);
  }
}

table {
    width: 100%;
    margin-bottom: 20px;
    /* border: 1px solid black; */
    /* border-collapse: collapse;  */
  }
  table tr {
    font-weight: bold;
    padding: 5px;
    border: 1px solid black;
  }
  table td {
    border: 1px solid black;
    padding: 5px;
    height: 40px;
  }

<table></table>

БЛОГ НА HUSL

Заполнить таблицу на половину по диагонали

Ответы (1 шт):