使用JavaScript在HTML表中显示空值或null值

eh57zj3b  于 2023-03-27  发布在  Java
关注(0)|答案(1)|浏览(229)

我正在构建一个HTML表,它使用我在Stack Overflow中找到的JavaScript代码从Google Sheets中提取数据,它工作得很好。我不想打印有空值或null值的行。我没有JS的经验,不知道怎么做。在C中,我会创建一个数组来存储当前行的值,并比较它们是否有效。这在JS中是个好主意吗?谢谢,我是初学者!!
代码:https://codepen.io/mikesteelson/pen/wvevppe(信用:Mike Steelson)

var id = '1n-rjSYb63Z2jySS3-M0BQ78vu8DTPOjG-SZM4i8IxXI';
var gid = '0';
var url = 'https://docs.google.com/spreadsheets/d/'+id+'/gviz/tq?tqx=out:json&tq&gid='+gid;
fetch(url)
  .then(response => response.text())
  .then(data => document.getElementById("json").innerHTML=myItems(data.slice(47, -2))  
  );
function myItems(jsonString){
  var json = JSON.parse(jsonString);
  var table = '<table><tr>'
  json.table.cols.forEach(colonne => table += '<th>' + colonne.label + '</th>')
  table += '</tr>'
  json.table.rows.forEach(ligne => {
    table += '<tr>'
    ligne.c.forEach(cellule => {
        try{var valeur = cellule.f ? cellule.f : cellule.v}
        catch(e){var valeur = ''}
        table += '<td>' + valeur + '</td>'
      }
    )
    table += '</tr>'
    }
  )
  table += '</table>'
  return table
}

我试着自己解决,但是没有用。

wfypjpf4

wfypjpf41#

您应该为当前行构建一个值数组,并检查是否至少有1个非空值,以便呈现<tr>

function myItems(jsonString) {
  var json = JSON.parse(jsonString);
  var table = '<table><tr>'
  json.table.cols.forEach(colonne => table += '<th>' + colonne.label + '</th>')
  table += '</tr>'
  json.table.rows.forEach(ligne => {
    // Build value array
    var rowData = [];
    ligne.c.forEach(cellule => {
      var valeur;     
      try {
        valeur = cellule.f ? cellule.f : cellule.v
      } catch (e) {
        valeur = ''
      }
      rowData.push(valeur);
    });
    // Determine if the row is render-able
    if (rowData.length && rowData.some(valeur => valeur)) {
      table += '<tr>'
      rowData.forEach(valeur => {
        table += '<td>' + valeur + '</td>'
      });
      table += '</tr>'
    }
  })
  table += '</table>'
  return table
}

相关问题