首页 > 解决方案 > 解析 JSON 对象时输出带有方括号和大括号的本地存储对象

问题描述

制作一个简单的应用程序,将人名、关系和星座作为输入并存储在本地存储中。这需要打印为 Name: text input, Relation: Selected input, Zodiac: Selected input。

HTML

<form>
    <label>Name</label>
    <input type="text" id="names">
    <label>Relationship</label>
    <select name="select1" id="relation">
<option value = "Husband">Husband</option>
<option value = "Wife">Wife</option>
<option value = "Sister">Sister</option>
<option value = "Cousin">Cousin</option>
<option value = "Friend">Friend</option>    
</select>
    <label>Zodiac</label>
    <select name="select2" id="stars">
<option value = "Aries">Aries</option>
<option value = "Taurus">Taurus</option>
<option value = "Gemini">Gemini</option>
<option value = "Cancer">Cancer</option>
<option value = "Leo">Leo</option>
<option value = "Virgo">Virgo</option>

<input type="button" value="Submit" id="btn">
<div id="logger"><pre></pre></div>
    
</form>

JS/jQuery

$(document).ready(function () {
$("#btn").click(function () {
    var myMemory = {};
myMemory.name = document.getElementById('names').value;
myMemory.relation = document.getElementById('relation').value;
myMemory.star = document.getElementById('stars').value;

//if user already has memories in local, get that array and push into it.
//else create a blank array and add the memory.
var memories = localStorage.getItem('memories') ?
              JSON.parse(localStorage.getItem('memories')) : 
              [];
memories.push(myMemory);
localStorage.setItem('memories', JSON.stringify(memories));
    }); 

dataString = localStorage.getItem('memories');
stored = JSON.parse(dataString);
logger.innerHTML = JSON.stringify(stored);
}); 

我解析本地存储时得到的输出是这样的,

[{"name":"Kevin","relation":"Friend","star":"Aries"},{"name":"John","relation":"Brother","star":"Gemini"}]

我想将其格式化如下。请帮忙。

name: Kevin, relation: Friend, star: Aries
name: John, relation: Brother, star: Gemini

标签: arraysobjectlocal-storage

解决方案


试试这个代码:

var arr = [{"name":"Kevin","relation":"Friend","star":"Aries"},{"name":"John","relation":"Brother","star":"Gemini"}] // replace this variable with your "stored" variable (after JSON.parse)

var output = '';

for (var i = 0; i < arr.length; i++) {
  output += "Name: " + arr[i].name + ", Relation: " + arr[i].relation + ", Star: " + arr[i].star + "\n"
}

console.log(output)


推荐阅读