如何从谷歌表格中导入数据

How do you Import data from a Google Sheets?

本文关键字:导入 数据 表格 谷歌      更新时间:2023-09-26

如何将谷歌电子表格的第一个单元格作为JavaScript字符串输出到HTML文档?

我有一个HTML文档,标签为:"Website.html"

<!DOCTYPE html>
<html>
     <head>
        <script>
          var textDisplay = Some code to import spreadsheet cell text;
          document.getElementById("display").innerHTML = textDisplay;
        </script>
     </head>
    <body>
        <p id="display"></p>
    </body>
</html>

和同一文件夹中的另一个文件,标签为:"电子表格。Xcel"(或任何文件类型)。第一个单元格包含文本:"Hello"。

如何将电子表格中的文本导入HTML文档的JavaScript中?

您的解决方案将取决于您的数据源;你包括了谷歌电子表格,所以这里有一个答案。简单说一下:谷歌电子表格不会是你服务器上的文件,而是在"云"里的谷歌硬盘里。

你可以从你的javascript中检索谷歌电子表格的内容,这里有一些例子:

  • 从google docs电子表格中获取单元格值到javascript
  • 通过Javascript访问Google-apps公共电子表格

以字符串形式检索数据单元格的基本思想:

  • 在Google Drive中创建您的电子表格。
  • 发布电子表格,为第一个单元格选择范围A1。应该为您提供如下URL:

    https://docs.google.com/spreadsheet/pub?key=SPREADSHEET_KEY&单= true& gid = 0,范围= A1&输出= csv

例子

function loadData() {
  var url="https://docs.google.com/spreadsheet/pub?key=p_aHW5nOrj0VO2ZHTRRtqTQ&single=true&gid=0&range=A1&output=csv";
  xmlhttp=new XMLHttpRequest();
  xmlhttp.onreadystatechange = function() {
    if(xmlhttp.readyState == 4 && xmlhttp.status==200){
      document.getElementById("display").innerHTML = xmlhttp.responseText;
    }
  };
  xmlhttp.open("GET",url,true);
  xmlhttp.send(null);
}
<html>
  <body>
    <button type="button" onclick="loadData()">Load Spreadsheet Data</button>
    <div id="display"></div>
  </body>
</html>

你也可以在这里看到一个jsfiddle

感谢GPSVisualizer,他们好心地发布了一个公共的谷歌电子表格,我可以在这个例子中使用