Javascript (html)：如何在本地文件（如 .csv、.txt 等）中搜索字符串

Question

我想在 html 中搜索并显示本地文件（如 csv 或 txt）中的数据。前任。打开并阅读“file.cvs”= (1;a bc;2;def;3;gh i)。如果我输入值“1”，将显示文本“a bc”。

<html>

<head><meta charset="UTF-8"></head>

<body onload="form1.reset();">

    <form id="form1">
      <fieldset>
      <label for="code">Code:</label>
      <input type="text" id="code" maxlength="6" required="">
      <p id="output">Text will be shown here!<p/>
      <input type="button" id="button" value="Ok">
      </form>
      </fieldset>
    </form>

<script>
    button.onclick = function() {
    document.getElementById("output").innerHTML = ????
</script>

</body>
</html>

提前致谢

Answer 1

所以根据澄清（谢谢），假设您已经将文件读入名为 csv 的变量作为起点。

根据问题的规定要求：

Ex. open and read "file.cvs" = (1;a bc;2;def;3;gh i). If I input value "1", a text "a bc" will be shown.

以下代码演示了如何创建可用于根据您的要求过滤键的对象文字。

在 ; 字符处拆分字符串
使用reduce创建对象文字（key/value对）
输入提示
使用输入数字作为键在对象字面量中查找
用key引用的值替换DOM内容

const csv = "1;a bc;2;def;3;gh i";

const hash = csv.split(';').reduce((acc, n, idx, array) => {
  if (idx % 2) {
    acc[array[idx - 1]] = n;
  } else {
    acc[array[idx]] = '';
  }
  return acc;
}, {});

console.log(hash);
let input = prompt("enter 1,2 or 3");
document.getElementById('output').textContent = hash[input];

<div id="output">Output will go here</div>

执行您在评论中提到的其他搜索需要示例数据，然后才能为该搜索提供答案。

Javascript (html)：如何在本地文件（如 .csv、.txt 等）中搜索字符串

Javascript (html): How to search a string in local file (like .csv, .txt, etc)

html

search

file

local