将 get.ElementByClass() 从嵌套的 div 写入文件

Question

我正在开发一个聊天机器人，用户可以在其中与聊天机器人交谈，并且我想将对话记录到一个文本文件中。我在考虑获取代表对话的 <div class="msg-text">，document.getElementByClass("msg-text")[0].innerText; 是聊天机器人的响应，document.getElementByClass("msg-text")[1].innerText; 是用户的响应，并将其读入文件。偶数（0、2、4、6、8 等）和奇数（1、3、5、7、9 等）中的聊天机器人响应是用户的响应。

有没有更有效的方法来抓取元素并将它们写入文件？现在我的文件里什么也没有。

// This function finds odd/even and write to file
function findTheOddOnes_ToFile() {
    var fso = new ActiveXObject("Scripting.FileSystemObject"),
        thefile = fso.CreateTextFile("/Desktop/even.txt", True);
 
  // find odd/even numbers in element
    for (var i=0;i => document.getElementsByClassName("msg-text").length;i++) {
        if ( i % 2 == 0) {
        //If even add the chatbots respons to file. Chatbot respons are even numbes (0,2,4,6,etc)
        //write to file 
      thefile.writeline("chatbot: " + document.getElementsByClassName("msg-text")[i].textContent + "<br>");
      }
        else{
         //if Odd write to file as users respons (1,3,5,7,etc)
        //write to file 
      thefile.writeline("You: : " + document.getElementsByClassName("msg-text")[i].textContent);
       }
      }
}

<body>
  <!-- partial:index.partial.html -->
  <section class="msger">
    <header class="msger-header">
      <div class="msger-header-title">
        <i class="fas fa-bug"></i> SE Chatbot <i class="fas fa-bug"></i>
      </div>
    </header>

    <main class="msger-chat">
      <div class="msg left-msg">
        <div class="msg-img" style="background-image: url(https://image.flaticon.com/icons/svg/327/327779.svg)"></div>

        <div class="msg-bubble">
          <div class="msg-info">
            <div class="msg-info-name">SEBot_real</div>
            <div class="msg-info-time">12:45</div>
          </div>

          <div class="msg-text">
            Hi, welcome to SE-Bot! Go ahead and send me a message. 
          </div>
        </div>

Answer 1

是的，不要多次调用 document.getElementsByClassName()。此外，如果用户在聊天机器人响应之前输入两次内容会怎样？

我建议您在 .msg-bubble 元素中添加 msg-bubble-user 和 msg-bubble-bot。然后循环遍历，根据class名字，而不是位置：

记录成绩单

document.querySelector(".msg-bubble").forEach(el=>{
    const speaker = el.matches(".msg-bubble-user") ? "You" : "Chatbot";
    const content = el.querySelector(".msg-text").textContent;
    thefile.writeline(`${speaker}: ${content}<br />`);
});

^未测试

如果您的文件是空的，请添加一个 console.log() 调用以查看您是否收到了您期望的文本。

将 get.ElementByClass() 从嵌套的 div 写入文件

write get.ElementByClass() from nested div to file

javascript

getelementsbyclassname