javascript - 用JS HTML从右向左绘制一个倒直 Angular 三 Angular 形

Question

我正在尝试用HTML中的JS绘制下图中的第三个和第四个三 Angular 形。我为前两个三 Angular 形创建了两个函数，我想我只需要为第三个和第四个三 Angular 形稍微扭转 for 循环，但我不知道该怎么做。 这是前两个的代码。

function draw1() {
  let mytable = "<table>"
  for (let i = 1; i < 6; i++) {
        mytable += "<tr>";
        mytable += "<td>" + "*".repeat(i) +"</td>";
        }
        mytable += "</tr>"
  document.write(mytable)
}

draw1()

function draw2() {
  let mytable = "<table>"
  for (let i = 5; i > 0; i--) {
        mytable += "<tr>";
        mytable += "<td>" + "*".repeat(i) +"</td>";
        }
        mytable += "</tr>"
  document.write(mytable);
}

draw2()

Answer 1

为了旋转您的*箭头，您不必重做js。您只需对 js 创建的 table 使用 css direction: rtl 规则即可。像这样:

table {
  direction: rtl;
}

function draw1() {
  let mytable = "<table>"
    for (let i = 1; i < 6; i++) {
      mytable += "<tr>";
      mytable += "<td>" + "*".repeat(i) +"</td>";
    }
    mytable += "</tr>"
    document.write(mytable);
}

draw1();

function draw2() {
  let mytable = "<table>"
    for (let i = 5; i > 0; i--) {
      mytable += "<tr>";
      mytable += "<td>" + "*".repeat(i) +"</td>";
    }
    mytable += "</tr>"
    document.write(mytable);
}

draw2();

table {
  direction: rtl;
}