使用通用 function 更新多个 innerhtml 变量

Question

我正在尝试将许多类似的功能组合成一个，但遇到了一些困难。

这是原始功能之一的示例（通过按下按钮调用）。

    function ADD_ONE(Variable_Name){
Variable_Name += 1;
        document.getElementById(Variable_Name).innerHTML = Variable_Name;
   };

这是我的替换尝试

function ADD_ONE(Variable_Name){
Variable_Name += 1;
        document.getElementById(Variable_Name).innerHTML = Variable_Name;
   };

这会导致错误：

ref(v1.0).html:744 Uncaught TypeError: Cannot set property 'innerHTML' of null
    at ADD_ONE 

这可能是我缺少的一些非常简单的东西，但对于 Javascript 来说仍然相对较新，将不胜感激。

Answer 1

你的 HTML 是什么？ 该错误通常意味着您的页面没有您尝试调用document.getElementById()的元素，因为如果该元素不存在，它将返回 null ，并且 null 没有 innerHTML 属性，因为它不是元素。 但是，如果没有看到 HTML，就无法验证这一点。

Answer 2

问题是您在获取原始元素之前更改 Variable_Name 的顺序，所以只需输入：

var element = document.getElementById(Variable_Name);

Variable_Name += 1;

element.innerHtml += Variable_Name;

Answer 3

因为当你 +1 你的变量，之后当你想要获取这个元素时，这个元素在 DOM 中不存在，

Variable_Name += 1  

此行不正确，并且您在 DOM 中没有此元素