Javascript I'；我正在尝试创建一个bot，我希望我的所有消息都包含在JS中的同一个div中

因此，我正在创建一个聊天机器人，现在我的文本在键入时显示，但并非全部显示在同一个div中。发送第一条消息后，其余文本显示在输入表单下方

我尝试应用我在顶部按钮上使用的相同元素，但仍然不起作用。因为它让最初的信息消失了。我希望所有的信息都保持在当前状态

var btnClick = function(text) {
  counter++;
    if (counter == 1) {
        document.getElementById("upDateText").innerText
        let newElement = document.createElement("h1");
        newElement =  = "I am " + text + "!";
        newElement.style.textAlign = "right";
        newElement.innerText = "Hi " + text + "!";
        document.body.appendChild(newElement);
        createHobbies();
      } else if (counter == 2) {
        let newElement = document.createElement("h1");
        let hobbies = 'your hobies here';
        newElement.innerText =
          "that is so cool that you like" + hobbies + " can we be friends"; // your "hobies" is not defined!
        document.body.appendChild(newElement);
      } 

  if (form.inputbox.value === "") {
    let newElement = document.createElement("h1");
    newElement.style.color = "red";
    newElement.innerText = "sorry bout that";
    document.body.appendChild(newElement);
  }
};

---

只需将方法从

body

更改为

getElementById（“upDateText”）

---

您正在将所有元素附加到body

document.body.appendChild（…）

如果要将它们放入div，则需要将它们附加到该div，而不是body。我是说id为“upDateText”的div刚刚起作用了！谢谢

var btnClick = function(text) {
  counter++;

  if (counter == 1) {
    document.getElementById("upDateText").innerText = "I am " + text + "!";
    let newElement = document.createElement("h1");
    newElement.style.textAlign = "right";
    newElement.innerText = "Hi " + text + "!";

    document.getElementById("upDateText").appendChild(newElement);
    createHobbies();
  } else if (counter == 2) {
    let newElement = document.createElement("h1");
    let hobbies = 'your hobies here';
    newElement.innerText =
      "that is so cool that you like" + hobbies + " can we be friends"; // your "hobies" is not defined!
    document.getElementById("upDateText").appendChild(newElement);
  } 

  else if (form.inputbox.value === "") {
    let newElement = document.createElement("h1");
    newElement.style.color = "red";
    newElement.innerText = "sorry bout that";
    document.getElementById("upDateText").appendChild(newElement);
  }
};