javascript - 使用普通 JS 将表转换为键值对

标签 javascript

我有一个由行号和价格组成的大表。我希望能够使用行号查找价格。

enter image description here

function buildtable(){

   var tableObj = document.getElementById( 'table' );

   var allTRs = tableObj.getElementsByTagName( 'tr' );
   for ( var trCounter = 0; trCounter < allTRs.length; trCounter++ )
   {
     var tmpArr = [];
     var allTDsInTR = allTRs[ trCounter ].getElementsByTagName( 'td' );
     for ( var tdCounter = 0; tdCounter < allTDsInTR.length - 1; tdCounter++ )
     {
       tmpArr.push( allTDsInTR[ tdCounter ].innerHTML );
     }
     arr.push( tmpArr );

  }

}

以下代码创建一个列表列表。

enter image description here

如何更改函数以创建单个 key 对存储?

表格的 HTML

foreach($res as $row) {

  $seat = $row['RowNumber'];  
  $price = $row['Zone.PriceMultiplier * 15.00'];

   echo "<tr>";
   echo "<td>".$seat."</td>";
   echo "<td>".$price."</td>";
   echo "<td><input type='checkbox' name='check_list[]' value=\"$seat;\" onclick='javatest(this);' </td>";
   echo "</tr>";


}

最佳答案

您可以使用对象作为键值映射(哈希表)。

function buildtable() {
    var tableObj = document.getElementById('table');
    var map = {};
    var allTRs = tableObj.getElementsByTagName('tr');
    for (var trCounter = 1; trCounter < allTRs.length; trCounter++) {
        var tmpArr = [];
        var allTDsInTR = allTRs[trCounter].getElementsByTagName('td');
    
        if (allTDsInTR.length) {
           map[allTDsInTR[0].innerHTML.trim()] = parseFloat(allTDsInTR[1].innerHTML.trim());
        }
    }
    
    console.log(map);

}

buildtable();
<table id='table'>
    <thead>
    <tr>
        <td>
            RowNumber
        </td>
        <td>
            Price
        </td>
    <tr>
    </thead>
    <tbody>
    <tr>
        <td>
            U01
        </td>
        <td>
            24.5
        </td>
    <tr>
    <tr>
        <td>
            U02
        </td>
        <td>
            22
        </td>
    <tr>
    </tbody>
</table>

结果将类似于:

{
  "U01": 24.5,
  "U02": 22
}

关于javascript - 使用普通 JS 将表转换为键值对,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59179442/

相关文章:

javascript - 测试 Vuetify (Vue.js) - 第二次调用 mount 抛出错误

javascript - jQuery如何设置/取消下拉菜单的背景颜色

javascript - 冗长的 javascript 条件寻求简化

javascript - 将 Ajax 请求从 Javascript 转换为 jQuery

javascript - Chrome 表示无法读取未定义的属性 'nodeName',IE6 没问题,使用 Google Map API

javascript - 保存从 ngFor 创建的表数据 Angular 2

javascript - 完全可以用meteor来开发手机app吗

javascript - 删除 <a> 功能

javascript - 通过嵌套对象id获取对象的长度?

javascript - 动态模型、商店和 View ——最好的方法