Javascript 更改id以填充html表

我试图用两个随机生成的数字，play1和play2来填充Html表中的10个帧，我可以填充前两个点，但在后面我无法填充其余的点，因为我无法更改变量newId1和newId2

var控制变量=1；
函数r（最小值、最大值）{
返回Math.floor（Math.random（）*（max-min+1））+min；
}
var min=0；
var max=10；
var play1；
var play2；
var帧=1；
var newId1=“s1f1”；
var newId2=“s2f1”；
函数myFunction（）{
如果（控制变量==1）{
play1=r（最小值，最大值）；
如果（播放1==10）{
//为第一点增值
newId1=“s1f”+帧；
document.getElementById（newId1）.innerHTML=play1；
frame++；
}否则{
//为第一点增值
document.getElementById（newId1）.innerHTML=play1；
控制变量++；
}
}
如果（控制变量==2）{
播放2=r（最小，最大-（播放1分钟））；
控制变量=1；
//为第二个位置增值
newId2=“s2f”+帧；
document.getElementById（newId2）.innerHTML=play2；
frame++；
}
document.getElementById（“demo”）.innerHTML=[play1，play2]；
}

表，th，td{
边框：1px纯黑；
填充：15px；
}

第1帧
第2帧
第3帧
第4帧
第5帧
第6帧
第7帧
第8帧
第9帧
第10帧
点击我

这是因为您正在更改

newId

（在

newId=“s1f”+frame；

中），但从未使用过它。您只使用newId1和newId2。

这是因为您正在更改

newId

（在

newId=“s1f”+frame；

）但从未使用它。您只使用newId1和newId2。

您的问题在行

newId=“s1f”+帧中

变量
newId
尚未定义，并且在代码中的任何位置都不会引用该变量，除非在您设置它的位置。因此，您的代码将只设置默认框的值（已指定为
s1f1
）

将
newId
更改为
newId1
，您就可以出发了
 您的问题在
newId=“s1f”+框架中

  <script>
  var controlVariable = 1;

  function r(min, max){
    return Math.floor(Math.random() * (max-min+1)) + min;
  }

  var min = 0;
  var max = 10;
  var play1;
  var play2;
  var frame = 1; 
  var newId1 = "s1f";
  var newId2 = "s2f";

  function myFunction() {
    if (controlVariable == 1) {
      play1 = r(min, max);
      if(play1 === 10) {
        // add value to first spot 
        newId = "s1f"+frame;
        document.getElementById(newId).innerHTML = play1;
        frame++; 
      } else {
        //add value to first spot
        newId = "s1f"+frame;
        document.getElementById(newId).innerHTML = play1;
        controlVariable++; 
      }

    }
    else if (controlVariable == 2) {
      play2 = r(min, max - (play1-min));
      controlVariable = 1;
      // add value to second spot
      document.getElementById(newId2).innerHTML = play1;
      frame++;
    }

    document.getElementById("demo").innerHTML = [play1, play2];
  }
  </script>

变量
newId
尚未定义，并且在代码中的任何位置都不会引用该变量，除非在您设置它的位置。因此，您的代码将只设置默认框的值（已指定为
s1f1
）

将
newId
更改为
newId1
，您就可以出发了
 

  <script>
  var controlVariable = 1;

  function r(min, max){
    return Math.floor(Math.random() * (max-min+1)) + min;
  }

  var min = 0;
  var max = 10;
  var play1;
  var play2;
  var frame = 1; 
  var newId1 = "s1f";
  var newId2 = "s2f";

  function myFunction() {
    if (controlVariable == 1) {
      play1 = r(min, max);
      if(play1 === 10) {
        // add value to first spot 
        newId = "s1f"+frame;
        document.getElementById(newId).innerHTML = play1;
        frame++; 
      } else {
        //add value to first spot
        newId = "s1f"+frame;
        document.getElementById(newId).innerHTML = play1;
        controlVariable++; 
      }

    }
    else if (controlVariable == 2) {
      play2 = r(min, max - (play1-min));
      controlVariable = 1;
      // add value to second spot
      document.getElementById(newId2).innerHTML = play1;
      frame++;
    }

    document.getElementById("demo").innerHTML = [play1, play2];
  }
  </script>

var控制变量=1；
函数r（最小值、最大值）{
返回Math.floor（Math.random（）*（max-min+1））+min；
}
var min=0；
var max=10；
var play1；
var play2；
var帧=1；
var newId1=“s1f”；
var newId2=“s2f”；
函数myFunction（）{
如果（控制变量==1）{
play1=r（最小值，最大值）；
如果（播放1==10）{
//为第一点增值
newId=“s1f”+帧；
document.getElementById（newId）.innerHTML=play1；
frame++；
}否则{
//为第一点增值
newId=“s1f”+帧；
document.getElementById（newId）.innerHTML=play1；
控制变量++；
}
}
else if（控制变量==2）{
播放2=r（最小，最大-（播放1分钟））；
控制变量=1；
//为第二个位置增值
getElementById（newId2）.innerHTML=play1；
frame++；
}
document.getElementById（“demo”）.innerHTML=[play1，play2]；
}

var控制变量=1；
函数r（最小值、最大值）{
返回Math.floor（Math.random（）*（max-min+1））+min；
}
var min=0；
var max=10；
var play1；
var play2；
var帧=1；
var newId1=“s1f”；
var newId2=“s2f”；
函数myFunction（）{
如果（控制变量==1）{
play1=r（最小值，最大值）；
如果（播放1==10）{
//为第一点增值
newId=“s1f”+帧；
document.getElementById（newId）.innerHTML=play1；
frame++；
}否则{
//为第一点增值
newId=“s1f”+帧；
document.getElementById（newId）.innerHTML=play1；
控制变量++；
}
}
else if（控制变量==2）{
播放2=r（最小，最大-（播放1分钟））；
控制变量=1；
//为第二个位置增值
getElementById（newId2）.innerHTML=play1；
frame++；
}
document.getElementById（“demo”）.innerHTML=[play1，play2]；
}
我知道这并不是你真正想要的，但我还是冒着被否决的风险发布。当您发现自己通过连接计数器来管理id名称时，您需要问问自己是否应该使用数组。我认为在这种情况下你绝对应该这样做，因为这样会更容易管理你的逻辑。我不是百分之百的知道这场比赛应该做什么，但是看起来你在跟踪保龄球的得分。考虑一下这样的事情：

首先，使您的html如下所示：

<td class="dd" colspan="3"></td>
<td class="dd" colspan="3"></td>

所以现在的逻辑实际上遵循了游戏的逻辑。最后一个框架当然需要做一些工作，但如果需要的话应该会更容易。可能还有更好的变体，但基本思想是使用列表，而不是管理字符串id名称。
我知道这不是你真正要求的，但无论如何我都会冒着被否决的风险发布。当您发现自己通过连接计数器来管理id名称时，您需要问问自己是否应该使用数组。我认为在这种情况下你绝对应该这样做，因为这样会更容易管理你的逻辑。我不是百分之百的知道这场比赛应该做什么，但是看起来你在跟踪保龄球的得分。考虑一下这样的事情：

首先，使您的html如下所示：

<td class="dd" colspan="3"></td>
<td class="dd" colspan="3"></td>

所以现在的逻辑是