使用JavaScript的getElementById为何返回标签类型而非预期内容？

安全阿岳

2026-8-19

问题解决：页面显示[object HTMLParagraphElement]1而非预期的1

原因分析

出现这个问题的核心是DOM元素对象被直接当作字符串处理：要么是你误把元素对象（变量a）和字符串（变量b）拼接（比如写成a += b而非a.innerHTML += b），要么是之前的操作把元素对象本身赋值给了innerHTML，导致元素内容先被设为[object HTMLParagraphElement]，后续追加"1"就出现了错误结果。

修复方案

确保操作元素的innerHTML属性
你示例代码里的a.innerHTML += b写法本身正确，如果实际代码中漏写了.innerHTML，修正为正确写法即可。
重置元素初始内容（可选）
如果元素之前已有错误内容，可先清空再设置或追加：

<!DOCTYPE html>
<html>
  <head>
    <title>Title</title>
  </head>
  <body>
    <p id="textlabel"></p>
  
    <script>
      function bonef(){
        var a = document.getElementById("textlabel");
        var b = "1";
        // 不需要追加的话，直接赋值覆盖：
        // a.innerHTML = b;
        // 需要追加的话，确保初始内容为空后执行：
        a.innerHTML += b;
      }
    </script>

    <button onclick="bonef();">1</button>

  </body>
</html>