Question

我有一个移动应用程序，希望用户能够在其中将位置保存在其localStorage中。我有一个空白的HTML页面，称为“保存的位置”。当用户导航到此页面时，我希望从设备中保存的任何位置动态创建超链接。我可以遍历所有键并列出它们，但是尝试动态创建div元素时遇到了麻烦。这是我的JavaScript：

myApp.onPageInit('saved_locations', function (page) {

             var fragment = document.createDocumentFragment();
             var parent = document.getElementById("saved");

             // iterate localStorage
             for (var i = 0; i < localStorage.length; i++) {

             // set iteration key name
             var key = localStorage.key(i);

             // use key name to retrieve the corresponding value
             var value = localStorage.getItem(key);

             // console.log the iteration key and value
             console.log('Key: ' + key + ', Value: ' + value);

             let node = document.createElement("div")  ;
             let text = document.createTextNode(key); //value is taken from your loop
             node.appendChild(text);

             fragment.appendChild(node);

            }

             parent.appendChild(fragment);
    });

Answer 1

将元素和ID分配给您希望它们出现的元素。然后

var fragment = document.createDocumentFragment();
var parent = document.getElementById("yourId");

loop goes here {

    let node = document.createElement("div")  ;           
    let text = document.createTextNode(value); //value is taken from your loop
    node.appendChild(text);

    fragment.appendChild(node);
}

parent.appendChild(fragment);

JavaScript迭代键并创建Div元素

1 个答案: