如何在js中读取txt文件并在不同的div中打印它的行

在JavaScript中，可以使用XMLHttpRequest对象或fetch API来读取txt文件并将其行打印到不同的div中。

使用XMLHttpRequest对象的示例代码如下：

function readTxtFile(fileUrl, divIds) {
  var xhr = new XMLHttpRequest();
  xhr.open('GET', fileUrl, true);
  xhr.onreadystatechange = function() {
    if (xhr.readyState === 4 && xhr.status === 200) {
      var lines = xhr.responseText.split('\n');
      for (var i = 0; i < lines.length; i++) {
        var line = lines[i].trim();
        if (line !== '') {
          var divId = divIds[i % divIds.length];
          var div = document.getElementById(divId);
          div.innerHTML += line + '<br>';
        }
      }
    }
  };
  xhr.send();
}

// 调用示例
var fileUrl = 'example.txt'; // txt文件的URL
var divIds = ['div1', 'div2', 'div3']; // 不同div的id数组
readTxtFile(fileUrl, divIds);

使用fetch API的示例代码如下：

function readTxtFile(fileUrl, divIds) {
  fetch(fileUrl)
    .then(response => response.text())
    .then(text => {
      var lines = text.split('\n');
      for (var i = 0; i < lines.length; i++) {
        var line = lines[i].trim();
        if (line !== '') {
          var divId = divIds[i % divIds.length];
          var div = document.getElementById(divId);
          div.innerHTML += line + '<br>';
        }
      }
    })
    .catch(error => console.log(error));
}

// 调用示例
var fileUrl = 'example.txt'; // txt文件的URL
var divIds = ['div1', 'div2', 'div3']; // 不同div的id数组
readTxtFile(fileUrl, divIds);

以上代码中，readTxtFile函数接受两个参数：txt文件的URL和不同div的id数组。它通过XMLHttpRequest对象或fetch API发送GET请求获取txt文件的内容，并将内容按行分割后打印到不同的div中。divIds数组用于指定不同的div，如果行数多于div的数量，会循环使用div。

请注意，以上代码仅演示了如何在JavaScript中读取txt文件并打印到不同的div中，实际应用中可能需要根据具体需求进行适当的修改和优化。