如何使用 JavaScript 数组为 HTML 中的 table 仅 select 一些项目

Question

我正在从 API 中获取数据，我想在具有 3 列和动态行的 table 中显示此数据 - 这是因为 API 数据

我这里有这个代码：

})
                })
        //console.log(await response.json())
            const balancestoken = await response.json()
           
            function generateTableHead(table, data) {
            let thead = table.createTHead();
            let row = thead.insertRow();
            for (let key of data) {
                let th = document.createElement("th");
                let text = document.createTextNode(key);
                th.appendChild(text);
                row.appendChild(th);
            }
            }

            function generateTable(table, data) {
            for (let element of data) {
                let row = table.insertRow();
                for (key in element) {
                let cell = row.insertCell();
                let text = document.createTextNode(element[key]);
                cell.appendChild(text);
                }
            }
            }

            let table = document.querySelector("table");
            let data = Object.keys(balancestoken[0]);
            generateTableHead(table, data);
            generateTable(table, balancestoken);
                    }

使用此代码时，我得到以下输出 (table):

token_address   name    symbol  logo    thumbnail   decimals    balance 0x925841cf448a6c350bd19a7a0bdff93da9760a53  SafeCoom    SAFECOOM    null    null    9   108221437157689 0xf68c9df95a18b2a5a5fa1124d79eeeffbad0b6fa  Anyswap-BEP20   ANY null    null    18  1000000000000000000 0xd22202d23fe7de9e3dbe11a2a88f42f4cb9507cf  Minereum BSC    MNEB    null    null    8   15000000000000 0x373233a38ae21cf0c4f9de11570e7d5aa6824a1e   ALPACAFIN.COM   ALPACA  null    null    18  28102000000000000000000000

这是我得到的列： token_address 名称符号徽标缩略图小数平衡

这是 API

的默认响应

我怎样才能 select 只有 token_address、交易品种和平衡并在我的 table 中显示它们？

Answer 1

为键添加条件表达式。这是代码：

function generateTableHead(table, data) {
  let thead = table.createTHead();
  let row = thead.insertRow();
  for (let key of data) {
    // add this expression
    if (key == "token_address" || key == "symbol" || key == "balance") 
    {
      let th = document.createElement("th");
      let text = document.createTextNode(key);
      th.appendChild(text);
      row.appendChild(th);
    }
  }
}

function generateTable(table, data) {
  for (let element of data) {
    let row = table.insertRow();
    for (key in element) {
      // add this expression
      if (key == "token_address" || key == "symbol" || key == "balance") {
        let cell = row.insertCell();
        let text = document.createTextNode(element[key]);
        cell.appendChild(text);
      }
    }
  }
}

如何使用 JavaScript 数组为 HTML 中的 table 仅 select 一些项目

How to select only a few items for a table in HTML using JavaScript Array

html

javascript

arrays

datatables