document.getElementById（“ elementId”）。innerHTML =（）的倍数，导致第二个返回为null

首先，让我解释一下我要做什么：我想为电子游戏编写一个脚本，该脚本计算游戏中有多少钱，并创建一个显示它的元素。追踪金钱部分很容易，但是显然制作元素就像我尝试过的最令人困惑的事情。

chrome控制台的Lightshot屏幕截图：https ://prnt.sc/shszc2屏幕截图中蓝色突出显示的行在执行两次后出现错误。我用红色将错误消息装箱。

我将从脚本中删除一些代码，主要是针对那些对我想要帮助的问题很重要的代码，而忽略我理解的代码。

还要注意，我对于使用Javascript生成图形非常陌生，因此，如果我制作元素的方式太可怕了，那是因为我一直在尝试随机废话，直到某些东西似乎起作用并坚持使用。

// The elements that I created. Again i know next to nothing about elements, so the only thing that I 
// know will work is this catastrophe. 
var initialDiv = document.getElementById('onecup');

mainText = initialDiv.appendChild(document.createElement('mainText'));
mainText.style.position = 'absolute';
mainText.style.left="50%";
mainText.style.top="64px"
mainText.style.width = "290px";
mainText.style.height = "160px";
mainText.style.color = "white";
mainText.style.zindex = 1;
mainText.style.fontSize = "18px"

trackerBack = mainText.appendChild(document.createElement('trackerBack'));
trackerBack.style.position = 'absolute';
trackerBack.style.left="-200px"
trackerBack.style.top="0px"
trackerBack.style.width = "400px";
trackerBack.style.height = "160px";
trackerBack.style.backgroundColor = "black";
trackerBack.style.opacity = ".20"
trackerBack.style.zindex=1;

diffTotal = trackerBack.appendChild(document.createElement('diffTotal'));
diffTotal.id = "diffTotal"
diffTotal.style.position = 'absolute';
diffTotal.style.top="20%"
diffTotal.style.left="40%";
diffTotal.style.color = "rgba(255,255,255,255)";
diffTotal.style.opacity = "1"
diffTotal.style.zindex = 2;
diffTotal.style.fontSize = "30px"

diffFielded = diffTotal.appendChild(document.createElement('diffFielded'));
diffFielded.id = "diffFielded"
diffFielded.style.position = 'absolute';
diffFielded.style.top="-15px"
diffFielded.style.left="0px";
diffFielded.style.color = "rgba(255,255,255,255)";
diffFielded.style.opacity = "1"
diffFielded.style.zindex = 2;
diffFielded.style.fontSize = "20px"

// This function is used by a latter function to set the values of the text elements. I initially didn't 
// have this but thought adding it would help, but nothing changed.
// By the way, "toBna2" stands for to "big number abbreviation". It doesn't do anything major, besides
// shrink down numbers. Tried removing it, problem still persists.
conductValues = function(targetName, targetAssignment) {
    document.getElementById(targetName).innerHTML = toBna2(targetAssignment)
}

// This looping function controls the values that the elements display. However, I removed the code that 
// tells the function what values to make the elements, so if you want to test it, I guess just define 
// the 4 values as anything or make your own.
findValueDiff = setInterval(function() {

// If i make one of these lines a comment, it works, regardless of which one it is. But if i let both of 
// them run, the second document.getElementById("elementId") returns as null. Always the second one.
   conductValues("diffTotal", (aValP + aValU - bValP - bValU))
   conductValues("diffFielded", (aValU - bValU))
}

我什至尝试这样做：

conductValues = function(targetName, targetAssignment) {
  if (document.getElementById(targetName) != "undefined") {
    document.getElementById(targetName).innerHTML = toBna2(targetAssignment)
  }
}

但是，所有要做的就是使函数在第一次尝试时失败，因为第二次总是document.getElementById("elementId")返回null。

我不确定是否包含了足够的信息，但是我不知道还有什么补充，所以我希望这样做。但是，如果您需要更多信息，请询问，我将尝试尽快编辑该帖子。

感谢所有响应者，我希望您在编码过程中保持健康，从而保持健康。

编辑1：认为如果一次设置一个实体变量，我会得到一些不同的结果：

conductValues = function(targetName, targetAssignment) {
    document.getElementById(targetName).innerHTML = toBna2(targetAssignment)
}

loopMode=0

findValueDiff = setInterval(function() {
    if (loopMode == 0) {
      conductValues("diffTotal", (aValP + aValU - bValP - bValU))
      loopMode = 1
    } else {
      conductValues("diffFielded", (aValU - bValU))
      loopMode = 0 
    }
  }, 1000
);

但是问题仍然没有改变。第二次尝试更新，但失败。