3
我正在使用jQuery来实现我需要的功能,但是在我的代码中有一部分是我认为可以改进的,但我没有想法,我有一个json调用,并且正在存储该数据在可变在jQuery上正确使用地图
var getData = localStorage.getItem('jsonData');
该变量有这个值
[
{
"enterprise" : [
{
"id" : "10",
"name" : "Hellen Quesada",
"role" : "Principal Software Engineer",
"picture" : "http://i276.photobucket.com/albums/kk35/Sicable/200x200/06.png",
"skype" : "skypeusername",
"email" : "[email protected]",
"account" : "digitas, flag",
"subDept" : "enterprise",
"location" : "Offshose: Costa Rica"
},
{
"id" : "11",
"name" : "Jonathan Chavez",
"role" : "Principal Creative Engineer",
"picture" : "http://i276.photobucket.com/albums/kk35/Sicable/200x200/06.png",
"skype" : "skypeusername",
"email" : "[email protected]",
"account" : "digitas, flag",
"subDept" : "enterprise",
"location" : "Offshose: Costa Rica"
},
{
"id" : "12",
"name" : "Rodrigo Ovares",
"role" : "Creative Engineer",
"picture" : "http://i276.photobucket.com/albums/kk35/Sicable/200x200/06.png",
"skype" : "skypeusername",
"email" : "[email protected]",
"account" : "digitas, flag",
"subDept" : "enterprise",
"location" : "Offshose: Costa Rica"
},
{
"id" : "13",
"name" : "Juan Morera",
"role" : "Software Engineer",
"picture" : "http://i276.photobucket.com/albums/kk35/Sicable/200x200/06.png",
"skype" : "skypeusername",
"email" : "[email protected]",
"account" : "digitas, flag",
"subDept" : "enterprise",
"location" : "Offshose: Costa Rica"
}
]
}
]
而且我遍历这个JSON这样才能达到,直到id
属性进行DOM中的渲染localStorage的
$.map(JSON.parse(getData), function(items) {
$.map(items, function(item) {
$.map(item, function(data) {
if (id === data.id) {
loading = true;
if (loading) {
$('.spinner').css('display', 'block');
setTimeout(function() {
$('.spinner').css('display', 'none');
cardTemplate.push('<li><span class="name-role" id="name">' +
'<span><img class="card-picture" src="'+ data.picture +'"/></span>' +
'<div class="main-info-card">' +
data.name + '<br>' +
data.role + '<br>' +
'Employee N.' + data.id +
'</div>' +
'</span></li>' +
'<li><p>Email: <strong>'+ data.email +'</strong></p></li>' +
'<li><p>Skype: <strong>'+ data.skype +'</strong></p></li>' +
'<li><p class="team"> '+ data.account +' <br> <strong>Enterprise</strong></p></li>' +
'<li><strong> '+ data.location +'</strong></li>');
$('<ul/>', {
"class" : "removeLi",
html: cardTemplate.join('')
}).prependTo('.personal-info');
var rem = $('.removeLi');
removeEl.push(rem);
if (rem.length > 1) {
rem.first().next().remove();
}
}, 1000);
}
} // if ends
});
});
});
正如你有看到我有3个$.map
S和那就是我想知道是否有改善的那部分的方式,到目前为止,这3个$.map
s的做什么我需要什么,但我认为重复$.map
可能会带来一些性能问题。
你有什么建议?