javascript - 使用 JavaScript 将数据从 .csv 文件导入到 HTML 表

标签 javascript html dom csv

<分区>

我已将 excel 文件保存为 .csv 文件,我想将该数据导入 HTML 表格中

例如.csv 文件中的数据为

Name, Father's Name, Roll No., Attendance
abc,xyz,11011519-059,P
abs,ijk,11011519-007,A

这段代码运行良好。它从 .csv 或 .txt 文件中成功读取数据,但我的问题是我想要 HTML 表中的数据。您能否提供一个我可以在此代码上实现的简单解决方案。

<!DOCTYPE html>
<html>
<head>
    <title>Read File (via User Input selection)</title>
    <script type="text/javascript">
        var reader; //GLOBAL File Reader object for demo purpose only

        /**
         * Check for the various File API support.
         */
        function checkFileAPI() {
            if (window.File && window.FileReader && window.FileList && window.Blob) {
                reader = new FileReader();
                return true;
            } else {
                alert('The File APIs are not fully supported by your browser. Fallback required.');
                return false;
            }
        }

        /**
         * read text input
         */
        function readText(filePath) {
            var output = ""; //placeholder for text output
            if (filePath.files && filePath.files[0]) {
                reader.onload = function (e) {
                    output = e.target.result;
                    displayContents(output);
                };//end onload()
                reader.readAsText(filePath.files[0]);
            }//end if html5 filelist support
                        else { //this is where you could fallback to Java Applet, Flash or similar
                return false;
            }
            return true;
        }

        /**
         * display content using a basic HTML replacement
         */
        function displayContents(txt) {
            var el = document.getElementById('main');
            el.innerHTML = txt; //display output in DOM
        }
    </script>
</head>
<body>
</body>
</html>

最佳答案

function makeTable ( csv ) {

    var rows = csv.split('\n'),
    table = document.createElement('table'),
    tr = null, td = null,
    tds = null;

    for ( var i = 0; i < rows.length; i++ ) {
        tr = document.createElement('tr');
        tds = rows[i].split(',');
        for ( var j = 0; j < tds.length; j++ ) {
           td = document.createElement('td');
           td.innerHTML = tds[j];
           tr.appendChild(td);
        }
        table.appendChild(tr);
    }

    document.appendChild(table);

}

关于javascript - 使用 JavaScript 将数据从 .csv 文件导入到 HTML 表,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24545909/

相关文章:

javascript - Worker 构造函数是否接受相对 URL?

javascript - liferay6.2 中无法从 javascript 调用 portlet 资源 url

javascript - 在 anchor 标记前添加文本

javascript - Node JS动态集合ajax调用异步等待

javascript - jquery悬停图像交换在同一个div中使用2个图像

javascript - 如何使用 JavaScript 在 div 中创建输入标签

php dom 获取节点的所有属性

javascript - 为参数值不在当前范围内的元素创建 onclick

javascript - W3C 错误 : document type does not allow element X here; missing one of Y start-tag

javascript - 为什么 JavaScript 不返回样式属性?