计算错误时计算器显示错误

Question

[在此输入图片描述]( 你好，我想制作一个待办事项列表，但问题是输入文本如何在 dom 侦听器上工作，我创建了按钮和输入文本，但我不知道如何为文本框写入文本。 这个问题有解决办法吗

const middle = document.querySelector(".middle-part");
const text = document.querySelector(".addinglist");
const button = document.querySelector(".add");
const bottom = document.querySelector(".bottom-part")
const clear = document.querySelector(".clear") 
button.addEventListener("click", () => {
  let para = document.createElement("p");
  para.textContent = "text";
  bottom.append(para);
  clear.addEventListener("click", () => para.remove())
})

Answer 1

我已将您的代码放在这里。为了获取输入的值，您需要对该元素的引用，然后您需要获取它的

value

。

const middle = document.querySelector(".middle-part")
const text = document.querySelector(".addinglist")
const button = document.querySelector(".add")
const bottom = document.querySelector(".bottom-part")
const clear = document.querySelector(".clear")
const input = document.querySelector(".addinglist")

button.addEventListener("click", () => {
  let para = document.createElement("p")
  para.textContent = input.value
  bottom.append(para);

  // this is kind of wrong to be placed here:
  clear.addEventListener("click", () => para.remove())
})

<div class="container">
  <div class="top-part">
    <h1>To Do list app</h1>
  </div>
  <div class="middle-part">
    <input class="addinglist" type="text" placeholder="">
    <button class="add">Add_IT</button>

    <button class="clear">clearing</button>
  </div>
  <div class="bottom-part"></div>
</div>