科学计数法在表格中显示为十进制答案

【问题标题】：scientific notation displayed as decimal in table科学计数法在表格中显示为十进制
【发布时间】：2017-01-09 06:54:11
【问题描述】：

我目前正在使用从服务器获取的 JSON 数据填充 HTML 表。

JSON 看起来像这样：

[
   {
      "field1":"someString",
      "value":6e-21
   },
   {
      "field1":"someOtherString",
      "value":1e-4
   }
]

但在 HTML 表格中，如果数字适合 div ，则“值”字段有时会转换为十进制表示法

这里有一个fiddle 来演示这个问题

我想在 HTML 表中使用科学计数法的所有值（就像在我的 JSON 数据中一样）

【问题讨论】：

标签： javascript html css json

【解决方案1】：

将所有值转换为字符串

var data = [{
  "field1": "someString",
    "value": "6e-21"
}, {
   "field1": "someOtherString",
    "value": "1e-4"

}];

工作小提琴：- https://jsfiddle.net/e27w2poa/4/

【讨论】：

忘了说我需要能够对表中的数据进行排序，所以我需要将它们保持为两倍。还是谢谢你的回答

【解决方案2】：

使用toExponential()函数如下：

data[result].value.toExponential()

来自MDN：

toExponential() 方法返回一个表示Number 的字符串以指数形式表示的对象。

这是一个完整的sn-p：

var data = [{
  "field1": "someString",
  "value": 6e-21
}, {
  "field1": "someOtherString",
  "value": 1e-4
}];

var htmlContent = "<tbody>";

for (let result in data) {
  htmlContent += "<tr><td>" + data[result].field1 + "</td><td>" + data[result].value.toExponential() + "</td></tr>";
}

document.getElementById('table').innerHTML += htmlContent + "</tbody>";

table,
th,
td {
  border: 1px solid black;
}

<p>generated from JSON:  </p>
<table id="table">
  <thead>
    <tr>
      <td>field1</td>
      <td>value</td>
    </tr>
  </thead>
</table>
<p>expected:</p>
<table>
  <thead>
    <tr>
      <td>field1</td>
      <td>value</td>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>someString</td>
      <td>6e-21</td>
    </tr>
    <tr>
      <td>someOtherString</td>
      <td>1e-4</td>
    </tr>
  </tbody>
</table>

【讨论】：

【解决方案3】：

您可以使用toExponential() 转换回指数形式。工作 JSFiddle https://jsfiddle.net/e27w2poa/5/

【讨论】：