如何从网页中的 Google Sheets 单元格读取数据？

Question

我有一个本地网页，index.html其中一个 HTML 元素id="test"应该显示一个特定单元格的内容，例如 A3（“10”），来自这个 Google Spreadsheet。

我以网页的形式发布了它，但我不能 100% 确定它是否是我计划做的事情的最佳形式。

如何使用 JavaScript 在上面指定的元素中显示 Google 电子表格中的选定单元格？

我不能依赖 PHP，因为我想将index.html文件放在我的电脑和手机上，而不需要实际托管它们。

根据 Matthew Lock 的回答，我已链接到 tabletop.js，它位于我的 JS 文件夹中。此文件夹与索引文件位于同一级别。

    <script type="text/javascript" src="JS/tabletop.js"></script>

然后，在 JS 的主脚本标签中，我包含了：

function init() {
     Tabletop.init( { key: '1kFFysrHSapJXr-DxdYbuaMzkg5iBP60jR6OBFgzwSds',
               callback: function(data, tabletop) { window.alert("data") },
               simpleSheet: true } )
    };

看它是否吐出什么东西。它没有。甚至没有简单的“数据”警报。我究竟做错了什么？

这是我尝试在JSFiddle 中构建的一个最小示例，但我想我在如何链接到 tabletop.js（在外部资源下）方面遇到了其他问题......

Answer 1

如果您想使用 javascript 从您自己的网页中读取 Google Docs/Drive 单元格，我推荐使用Tabletop.js库：

<script type="text/javascript">
  window.onload = function() { init() };

  var public_spreadsheet_url = 'https://docs.google.com/spreadsheet/pub?hl=en_US&hl=en_US&key=0AmYzu_s7QHsmdDNZUzRlYldnWTZCLXdrMXlYQzVxSFE&output=html';

  function init() {
    Tabletop.init( { key: public_spreadsheet_url,
                     callback: showInfo,
                     simpleSheet: true } )
  }

  function showInfo(data, tabletop) {
    alert("Successfully processed!")
    console.log(data);
  }
</script>

showInfo 函数的数据参数将包含一个数组对象。数组的每一行对应于电子表格中的一行，单元格将位于一个对象中，每个列标题作为名称。例如：

[ { name: "Carrot", category: "Vegetable", healthiness: "Adequate" }, 
  { name: "Pork Shoulder", category: "Meat", healthiness: "Questionable" }, 
  { name: "Bubblegum", category: "Candy", healthiness: "Super High"} ]

在编写文档时注意似乎不正确。key 参数只需要来自公共电子表格 url 的键值，而不是整个 url。