如何在屏幕上获得数字输入

Question

我试图让我的数字在屏幕上显示分配的值，但我不知道如何做到这一点。

<div class="container">
<div class="Calaculatorout">
<div class="calculatordisplay">0</div>
<div class="buttons">
<button class="nine">9</button>
<button class="eight">8</button>
<button class="seven">7</button>
<button class="six">6</button>
<button class="five">5</button>
<button class="four">4</button>
<button class="three">3</button>
<button class="two">2</button>
<button class="one">1</button>
<button class="zero">0</button>
<button class="multi">X</button>
<button class="divide">/</button>
<button class="plus">+</button>
<button class="minus">-</button>
<button class="myForm">AC</button>
</div>
</div>
</div>

我需要找到一种方法来分配值在js或为他们出现在网页上。

const del = document.querySelector(".back");
const buttons = document.querySelectorAll(".buttons");
const clear = document.querySelector(".clear");
const display = document.querySelector(".calculatordisplay");
buttons.forEach((button) => {
buttons.addEventListener("click", (e) => {
appendNumber(e);
updateDisplay();
});
});
function updateDisplay() {
display.textcontent;
} 

Answer 1

请更具体地回答问题并提供所有细节。

无论如何，下面的代码将帮助您在屏幕上显示按钮值。此外，我还添加了连接逻辑。

但是如果你想实现一个计算器，你需要做一点额外的逻辑。不要忘记处理number/0或0/0场景😉

var disp = '';
function myFunction(x) {
disp = disp + x;
if(x == "AC") {
document.getElementById("calculatordisplay").innerHTML = 0;
} else if(disp == "") {
document.getElementById("calculatordisplay").innerHTML = x;
} else {
document.getElementById("calculatordisplay").innerHTML = disp;
}
}

<div class="container">
<div class="Calaculatorout">
<div id="calculatordisplay">0</div>
<div id="buttons">
<button onclick="myFunction(value)" id="nine" value="9">9</button>
<button onclick="myFunction(value)" id="eight" value="8">8</button>
<button onclick="myFunction(value)" id="seven" value="7">7</button>
<button onclick="myFunction(value)" id="six" value="6">6</button>
<button onclick="myFunction(value)" id="five" value="5">5</button>
<button onclick="myFunction(value)" id="four" value="4">4</button>
<button onclick="myFunction(value)" id="three" value="3">3</button>
<button onclick="myFunction(value)" id="two" value="2">2</button>
<button onclick="myFunction(value)" id="one" value="1">1</button>
<button onclick="myFunction(value)" id="zero" value="0">0</button>
<button onclick="myFunction(value)" id="multi" value="X">X</button>
<button onclick="myFunction(value)" id="divide" value="/">/</button>
<button onclick="myFunction(value)" id="plus" value="+">+</button>
<button onclick="myFunction(value)" id="minus" value="-">-</button>
<button onclick="myFunction(value)" id="myForm" value="AC">AC</button>
</div>
</div>
</div>