HTML Bot网站textarea命令异常，kill命令失效求助

我正在开发一个依赖textarea输入进行交互的Bot网站，测试help和kill两个命令时，发现kill命令无法正常执行，无法定位问题原因，现附上相关代码，恳请技术支持：

JavaScript代码 #

function reply() {
  const rplyBox = document.getElementById('rplyBox')
  const input = document.getElementById('msgBox').value;
  if (input === "help") {
    const embed = document.createElement("div");
    embed.classList.add("w3-round-xxlarge", "w3-margin-top", "w3-animate-opacity", "w3-margin-bottom", "w3-margin-right", "w3-margin-left")
    const title = document.createElement("h1")
    title.appendChild(document.createTextNode("Help"));
    const desc = document.createElement("h3")
    desc.appendChild(document.createTextNode("All of my commands!"));
    const field1 = document.createElement("h6")
    field1.classList.add("w3-border", "w3-topbar", "w3-bottombar", "w3-leftbar", "w3-rightbar", "w3-round-xlarge", "w3-border-black")
    field1.appendChild(document.createTextNode("kill"));
    const br = document.createElement('br');
    field1.appendChild(br);
    field1.appendChild(document.createTextNode('{name of the person to kill (figuratively)}'));
    embed.appendChild(title);
    embed.appendChild(desc);
    embed.appendChild(field1);
    rplyBox.appendChild(embed);
  } else if (input === "kill") {
    const cmdInput = input.value.split("\n");
    const person = cmdInput[1];
    const embed = document.createElement("div");
    embed.classList.add("w3-round-xxlarge", "w3-margin-top", "w3-animate-opacity", "w3-margin-bottom", "w3-margin-right", "w3-margin-left")
    const title = document.createElement("h1")
    title.appendChild(document.createTextNode("You killed " + person + "!"));
    const desc = document.createElement("h3")
    desc.appendChild(document.createTextNode("Well, they must've deserved it."));
    embed.appendChild(title);
    embed.appendChild(desc);
    rplyBox.appendChild(embed);
  }
}

CSS代码 #

html {
  height: 100%;
  width: 100%;
}

.main {
  margin-left: 5%;
  margin-right: 5%;
}

* {
  font-family: monospace;
}

t {
  font-size: 8vw;
}

body {
  animation: blueGrad;
  animation-iteration-count: infinite;
  animation-duration: 6s;
}

.sticky {
  position: -webkit-sticky;
  position: sticky;
}

HTML代码 #

<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>replit</title>
  <link href="style.css" rel="stylesheet" type="text/css" />
  <link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
  <script src="script.js"></script>
</head>
  
<body style="background-image: url('https://bot.valueyu.repl.co/bg.mp4'); background-size: cover;">
  <div class="main">
    <t>bot.valueyu</t>
    <p>bot.valueyu is a bot made by Aarav Saini/Valueyu. For commmands type "<span
        class="w3-text-white">help</span>".</p>
    <br>
    <p>Each command disappears after 5 seconds. Some commands which need time might last longer, In which case, the time will be defined in the bottom-left corner.</p>
    <hr>
    <textarea class="w3-round-large w3-bar w3-margin-top sticky" id="msgBox"></textarea>
    <br>
    <br>
    <br>
    <button id="submit" onClick="reply()" class="w3-round-xxlarge w3-button sticky">Send</button>
    <hr>
    <div class="w3-bar w3-white w3-round-large" id="rplyBox">
        
    </div>
  </div>
</body>

</html>

问题1：命令匹配逻辑错误 #

当前代码判断input === "kill"，但用户使用kill命令时输入的是多行内容（比如第一行kill，第二行名字），这个条件永远无法触发。需要改为判断输入的第一行是否为"kill"。

问题2：错误的属性调用 #

代码中const cmdInput = input.value.split("\n");是错误的——input已经是textarea的value值（字符串类型），不存在.value属性，直接调用会导致报错，应改为input.split("\n")。

问题3：未处理空输入情况 #

当用户只输入kill没写名字时，cmdInput[1]会是undefined，需要添加判断避免显示异常内容。

修改后的JavaScript代码 #

function reply() {
  const rplyBox = document.getElementById('rplyBox')
  const input = document.getElementById('msgBox').value.trim();
  if (input === "help") {
    const embed = document.createElement("div");
    embed.classList.add("w3-round-xxlarge", "w3-margin-top", "w3-animate-opacity", "w3-margin-bottom", "w3-margin-right", "w3-margin-left")
    const title = document.createElement("h1")
    title.appendChild(document.createTextNode("Help"));
    const desc = document.createElement("h3")
    desc.appendChild(document.createTextNode("All of my commands!"));
    const field1 = document.createElement("h6")
    field1.classList.add("w3-border", "w3-topbar", "w3-bottombar", "w3-leftbar", "w3-rightbar", "w3-round-xlarge", "w3-border-black")
    field1.appendChild(document.createTextNode("kill"));
    const br = document.createElement('br');
    field1.appendChild(br);
    field1.appendChild(document.createTextNode('{name of the person to kill (figuratively)}'));
    embed.appendChild(title);
    embed.appendChild(desc);
    embed.appendChild(field1);
    rplyBox.appendChild(embed);
  } else {
    const cmdInput = input.split("\n").map(line => line.trim());
    // 判断第一行是否为kill命令
    if (cmdInput[0] === "kill") {
      // 处理未输入名字的情况
      const person = cmdInput[1] || "someone";
      const embed = document.createElement("div");
      embed.classList.add("w3-round-xxlarge", "w3-margin-top", "w3-animate-opacity", "w3-margin-bottom", "w3-margin-right", "w3-margin-left")
      const title = document.createElement("h1")
      title.appendChild(document.createTextNode("You killed " + person + "!"));
      const desc = document.createElement("h3")
      desc.appendChild(document.createTextNode("Well, they must've deserved it."));
      embed.appendChild(title);
      embed.appendChild(desc);
      rplyBox.appendChild(embed);
    }
  }
}

内容的提问来源于stack exchange，提问作者Aarav Saini