javascript Html5 filereader - 读取本地 Json Array 文件并仅显示特定部分

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/17716071/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-27 09:19:24  来源:igfitidea点击:

Html5 filereader - read local Json Array file and display only a specific section

javascriptjsonfilereader

提问by Jean-Marc Flamand

I'm a beginner and come form VBA excel programming tool. Reading excel file, manipulating excel content is a lot easier in VBA than the web tool like Filereader and Json array.

我是一个初学者,来自 VBA excel 编程工具。在 VBA 中读取 excel 文件、操作 excel 内容比 Filereader 和 Json 数组等 Web 工具要容易得多。

I have the following content in my Json array file.

我的 Json 数组文件中有以下内容。

[
  ["TWE",6000,4545.5  ],
  ["RW",1000,256.3  ]
]

I would like to read from the following html file and display only the value 253.6

我想从以下 html 文件中读取并仅显示值 253.6

Can you help me.

你能帮助我吗。

Here the Html file reader example

这里是 Html 文件阅读器示例

<!DOCTYPE html>
<html>
    <head>
        <script>        
            function handleFileSelect()
            {               
                if (window.File && window.FileReader && window.FileList && window.Blob) {

                } else {
                    alert('The File APIs are not fully supported in this browser.');
                    return;
                }   

                input = document.getElementById('fileinput');
                if (!input) {
                  alert("Um, couldn't find the fileinput element.");
               }
               else if (!input.files) {
                  alert("This browser doesn't seem to support the `files` property of file inputs.");
               }
               else if (!input.files[0]) {
                  alert("Please select a file before clicking 'Load'");               
               }
               else {
                  file = input.files[0];
                  fr = new FileReader();
                  fr.onload = receivedText;
                  fr.readAsText(file);
               }
            }

            function receivedText() {           
               //result = fr.result;
               document.getElementById('editor').appendChild(document.createTextNode(fr.result))
            }           

        </script>
    </head>
    <body>
        <input type="file" id="fileinput"/>
        <input type='button' id='btnLoad' value='Load' onclick='handleFileSelect();'>
        <div id="editor"></div>
    </body>
</html>

回答by eX0du5

If you get the text with fr.readAsText into a string, you can use JSON.parse() (see: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON/parse) to convert the string into a JSON object. Then you can access your specific content like a normal array.

如果将带有 fr.readAsText 的文本转换为字符串,则可以使用 JSON.parse()(请参阅:https: //developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON/ parse) 将字符串转换为 JSON 对象。然后您可以像普通数组一样访问您的特定内容。