Question

我有一个本地网页index.html，其中带有id="test"的HTML元素应该显示一个特定单元格的内容，例如A3（＆＃34; 10＆＃34;），来自this 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 } )
    };

看它是否吐出任何东西。它没有。甚至没有简单的＆＃34;数据＆＃34;警报。我究竟做错了什么？

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

Answer 1

如果您想使用javascript从自己的网页上阅读Google文档/云端硬盘，我建议使用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函数的data参数将包含一个数组对象。数组的每一行对应于电子表格中的一行，单元格将位于一个对象中，每个列标题都作为名称。 E.g：

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

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

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

1 个答案: