如何将循环中的特定变量值附加到一个动态创建的元素上

Question

我正在努力从本地存储档案中获取密钥，我想将该密钥附加到动态创建的元素上，就像单击新创建的元素（获取存储文件的名称）时那样将提醒内容。这就是我所拥有的，问题出在archivo [keys [i]]中。

function local(){
    archivo = {};
    keys = Object.keys(localStorage);
    i = 0; var key;


    for (i = 0; key = keys[i] ; i++) {

    var compra_recuperada = document.createElement('ons-list-item');

    compra_recuperada.innerHTML = keys[i];                                            
    document.getElementById('compra').appendChild(compra_recuperada); 
    archivo[ keys[i] ] = localStorage.getItem( keys[i] ); 
compra_recuperada.addEventListener('click', function(){ alert(archivo[ keys[i] ])  
})}}; 

Answer 1

在循环外删除变量i的声明，并将for (i = 0; key = keys[i] ; i++)更改为for (let i = 0; key = keys[i]; i++)应该适合您的情况。

在先前版本中，每个元素共享相同的变量i。到您看到警报时，该警报已更改为最后一个值。由于ES6 let关键字，第二个版本将为每次循环迭代创建一个新变量。