document.getElementById returns HTMLDivElement {}

Question

我的 HTML 文件中有以下代码：

    <div id="calc-parent">
    <div class="row">
    <div class="column" id="calc-display-val">0</div>
    </div>

我需要获取 calc-display-val 的值，所以我有以下 JavaScript 代码：

let calcDisplayVal = document.getElementById("calc-display-val")

function pressOne() {
console.log(calcDisplayVal)
}

但我得到的不是 0，而是“HTMLDivElement {}”

如何获取 calc-display-val 的值？

Answer 1

您可以为此使用 .innerHTML :

let calcDisplayVal = document.getElementById("calc-display-val")

function pressOne() {
  console.log(calcDisplayVal.innerHTML)
}

pressOne()

<div id="calc-parent">
    <div class="row">
    <div class="column" id="calc-display-val">0</div>
</div>

Answer 2

如果您只需要打印 div 的内容：

console.log(document.getElementById("calc-display-val").innerHTML)

<div id="calc-parent">
        <div class="row">
            <div class="column" id="calc-display-val">0</div>
        </div>
</div>

javascript