javascript - 如何在元素可用时插入该元素？

Question

我正在努力编写代码。 我正在尝试做的事情:

• 当“显示”元素可用时，每隔几秒在其旁边插入随机数。

预期结果

• 当其“不可用”时，不能插入数字。
• 当其“可用”时，可以插入数字。

var myVar = setInterval(breakdown, 2000);
/*

var myVar1 = setInterval(random, 1000);

function random() {
  var n = Math.floor((Math.random() * 10) + 1);
  let loops = Array.from(document.querySelectorAll('.show'));
  for (const loop of loops) {
    if () {
      loop.innerHTML = n;

    }
  }
} 

*/

function breakdown() {

  let elems = Array.from(document.querySelectorAll('.demo'));
  for (const elems1 of elems) {
    let d = Math.random();

    if (d < 0.50) {
      let str = "Available";
      text = str.fontcolor("green");
      x = true;
    } else {
      let str = "Not Available";
      text = str.fontcolor("red");
      y = false;
    }
    elems1.innerHTML = text;
  }

}

<p id="demo1" class="demo">
  <p id="show1" class="show"></p>
  <p id="demo2" class="demo">
    <p id="show2" class="show"></p>
    <p id="demo3" class="demo">
      <p id="show3" class="show"></p>

Answer 1

为了读取其他元素(例如本例中的兄弟元素)状态(“可用”或“不可用”)以进行切换工作，您可以调用目标属性的 previousSibling 然后访问其innerHTML。阅读有关 previousSibling dom 属性的更多信息。 https://www.w3schools.com/jsref/prop_node_previoussibling.asp

fiddle