目前,我正在开展一个项目,以从 Google 表单/电子表格中提取数据并使用 JQuery/DataTables 将其显示在网站上。我收到了有关让数据出现在网站上的帮助,但我遇到了一个新问题。
上一个问题:是否可以使用 Google 脚本创建公共数据库(电子表格)搜索?
在谷歌上,我有一个输出八列的表单:
- 时间戳
- 标题
- 作者
- 类型
- 网址
- 话题)
- 国家/地区
- 标记
其中,我不需要显示时间戳,如果 URL 存在,我希望标题链接到 URL。由于我对 Javascript 或 DataTables 不太熟悉,因此我制作了第二张表格,并尝试将其简化为以下六个:
- 标题(目前正在使用 URL 格式化为
<a>
标签) - 作者
- 类型
- 话题)
- 国家/地区
- 标记
这几乎可以工作,除了我用来构建表格的脚本将标题字段呈现在单元格中,<a href=""></a>
并且在表格中可见。当前情况见标题“实际产出”下的表格;“目标表外观”下的表格是我的目标。
因此,有没有办法将<a href=""></a>
链接作为链接提供,尽管它们被放在 Google 电子表格单元格中?或者,有没有办法将当前脚本编辑为a)忽略时间戳列和b)使标题输出从URL列到URL的链接(具有适当的条件)?
编辑:我现在专注于链接;我有一个时间戳解决方案,涉及将数据复制到新的电子表格(因为表单对复制/粘贴信息非常严格)。当前的问题是让每个条目都有一个链接,假设 URL 在第一列,标题在第二列。请阅读 Mogsdad 的回答和我的第一条评论以获取更多信息。
解决方案:首先,感谢 Mogsdad 的灵感和洞察力的“火花”,引导我朝着解决方案的正确方向前进。为了解释总体思路,我不想在目标网站上显示来自 Google 电子表格的一列(URL),而是使用它的内容在另一个(标题)中创建链接。然后,一旦制作了表格,就会使用 DataTables 对其进行格式化。表格中的所有单元格都必须包含某些内容,因此如果单元格为空白,则必须填写“无”。
function cellEntries(json, dest, divId) {
var table = document.createElement('table');
table.setAttribute("id", divId + "table"); //Assign ID to <table> from the <div> name.
var thead = document.createElement('thead');
var tbody = document.createElement('tbody');
var thr;
var tr;
var entries = json.feed.entry;
var cols = json.feed.gs$colCount.$t; //The number of columns in the sheet.
var link; //Teporary holder for the URL of a row.
for (var i=0; i <cols; i++) { //For the first row of cells (column titles),
var entry = json.feed.entry[i];
if (entry.gs$cell.col == '1') { //For First Column / URL Column, (1)
if (thr != null) {
tbody.appendChild(thr);
}
thr = document.createElement('tr'); //Create <thr>/<tr> (???).
}
else { //For all other columns,
var th = document.createElement('th');
th.appendChild(document.createTextNode(entry.content.$t)); //Create title for each column.
thr.appendChild(th);
}
}
for (var i=cols; i < json.feed.entry.length; i++) { //For all remaining cells,
var entry = json.feed.entry[i];
if (entry.gs$cell.col == '1') { //For First Column / URL Column, (1)
if (tr != null) {
tbody.appendChild(tr);
}
tr = document.createElement('tr'); //Create <tr>.
hlink = entry.content.$t; //Put URL content into hlink.
}
else if (entry.gs$cell.col == '2') { //For Title Column,(2)
var td = document.createElement('td');
if (hlink != "None") { //If there is a link,
var alink = document.createElement('a'); //Make <a>
alink.appendChild(document.createTextNode(entry.content.$t)); //Put content in <a>
alink.setAttribute('href',hlink); //Assign URL to <a>.
td.appendChild(alink); //Put <a> in <td>.
}
else { //If there is no link,
td.appendChild(document.createTextNode(entry.content.$t)); //Put content in <td>.
}
tr.appendChild(td);
}
else { //For all other columns,
var td = document.createElement('td');
if (entry.content.$t != "None") { //If content is not "None",
td.appendChild(document.createTextNode(entry.content.$t)); //Output the content.
}
else { //Else,
td.appendChild(document.createTextNode("")); //Output a blank cell.
}
tr.appendChild(td);
}
}
$(thead).append(thr);
$(tbody).append(tr);
$(table).append(thead);
$(table).append(tbody);
$(dest).append(table);
$(dest + "table").dataTable();
};
function importGSS(json){
var divId = "targetdivid" //ID of the target <div>.
cellEntries(json, "#" + divId, divId);
};