【问题标题】:How to read store values in array in JS如何在JS中读取数组中的存储值
【发布时间】:2020-06-29 20:52:24
【问题描述】:

我想一一读取数组中存储的值并将其附加到 html 表中我可以从数组中读取数据它一次获取所有值我想一一读取值但是有一些问题。请帮帮我。

<script>
    var time="";
    var temp="";
    var current="";
    $(document).ready(function storetime(){

    time=['11:34:4','11:43:4','11:55:4','11:22:4','11:11:4'];
    temp=[33,44,55,66,77];
    current=[22,33,444,55,666];

var tim =[[time,temp,current]];
$.each(tim,function(i,val){
               $('#abc').append(`<tr><td>`+(this)[0]+`</td><td>`+(this)[1]+`</td><td>`+(this)[2]+`</td></tr>`); 
        });


});
</script>


````````output``````````````
Time Stamp  Temperature Current
11:34:4,11:43:4,11:55:4,11:22:4,11:11:4 33,44,55,66,77  22,33,444,55,666 

`````````````````I want output like this``````````

Time Stamp  Temperature Current
11:34:4 22  44
11:34:5 44  44
11:34:6 33  22
11:34:7 11  0
11:34:8 

【问题讨论】:

  • 为什么不使用for 循环?
  • array in an array 让情况更复杂、效率低下?分别使用它们,制作 1 行,然后将for loop 用于所有这些。

标签: javascript html arrays html-table


【解决方案1】:

    var time="";
    var temp="";
    var current="";
    $(document).ready(function storetime(){

    time=['11:34:4','11:43:4','11:55:4','11:22:4','11:11:4'];
    temp=[33,44,55,66,77];
    current=[22,33,444,55,666];

var tim =[time,temp,current];

var length = tim[0].length;

for(let i=0;i<length;i++){

               $('#abc').append(`<tr><td>`+tim[0][i]+`</td><td>`+tim[1][i]+`</td><td>`+tim[2][i]+`</td></tr>`); 
       
}

});
td{
width:100px;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id='abc'></div>

【讨论】:

    【解决方案2】:

    你应该这样做,

    var time="";
    var temp="";
    var current="";
    $(document).ready(function storetime(){
    
    time=['11:34:4','11:43:4','11:55:4','11:22:4','11:11:4'];
    temp=[33,44,55,66,77];
    current=[22,33,444,55,666];
    
    var tim =[time,temp,current];
    $.each(time,function(i,val){
        $('#abc').append(`<tr><td>`+tim[0][i]+`</td><td>`+tim[1][i]+`</td><td>`+tim[2][i]+`</td></tr>`); 
    });
    

    我们知道这里的所有数组(时间、温度、电流)都具有相同的长度。因此,我们需要使用其中一个数组进行迭代。除了没有必要使 tim 成为嵌套数组。

    【讨论】:

      【解决方案3】:

      使用索引引用其他数组

      var time = [];
      var temp = [];
      var current = [];
      $(document).ready(function storetime() {
        time = ['11:34:4', '11:43:4', '11:55:4', '11:22:4', '11:11:4'];
        temp = [33, 44, 55, 66, 77];
        current = [22, 33, 444, 55, 666];
      
        $.each(time, function(i, val) {
          $('#abc').append(
            `<tr><td>` +
              val +
              `</td><td>` +
              temp[i] +
              `</td><td>` +
              current[i] +
              `</td></tr>`
          );
        });
      });
      table, th, td {
        border: 1px solid black;
        border-collapse: collapse;
      }
      <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
      <table id="abc">
        <tr>
          <th>Time Stamp</th>
          <th>Temperature</th>
          <th>current</th>
        </tr>
      </table>

      【讨论】:

        【解决方案4】:

        初始化tim时有两个括号:

        [[time,temp,current]]
        

        而 tim[0] 是 [time,temp,current],看起来像

        [['11:34:4','11:43:4','11:55:4','11:22:4','11:11:4'],
         [33,44,55,66,77],
         [22,33,444,55,666]]
        

        你有嵌套数组,所以在你的情况下 tim[0][0] 将是['11:34:4','11:43:4','11:55:4','11:22:4','11:11:4']

        您可以减少不必要的括号,也可以以正确的方式访问元素。

        【讨论】:

          猜你喜欢
          • 1970-01-01
          • 1970-01-01
          • 2021-02-22
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          • 1970-01-01
          • 2016-01-18
          相关资源
          最近更新 更多