使用AJAX从JSON文件中获取数据。如何使用jQuery缩短代码？
使用AJAX从JSON文件中获取数据。如何使用jQuery缩短代码？
提问于 2018-07-12 02:18:44
如何使用jQuery缩短代码？与其手动选择每个元素，或许可以使用单独的函数来创建<li>元素？
$.ajax({
url: 'choosePizza.json',
dataType: 'json',
type: 'GET',
success: function(choosePizzaData) {
choosePizzaHTML(choosePizzaData);
}
});
function choosePizzaHTML(choosePizzaInData) {
var boxar = $('.box1_data');
var text = "";
/*Selecting each parameter manually and get the value from the json file and place them in a list. Is there a way to shorten this? Without having to select it manually*/
$(choosePizzaInData[0]).each(function(index, value) {
text += '<li>' + value.botten[0] + '</li>';
text += '<li>' + value.botten[1] + '</li>';
});
boxar.html(text);
var box2 = $('.box2_data');
var text = "";
$(choosePizzaInData[1]).each(function(index, value) {
text += '<li>' + value.topping[0] + '</li>';
text += '<li>' + value.topping[1] + '</li>';
text += '<li>' + value.topping[2] + '</li>';
});
box2.html(text);
}JSON示例：
[ { "botten": ["Krispig", "tunn"] }, { "topping": ["kött", "kyckling", "tomat"] }, { "extra": ["Fanta", "Coca cola", "Sprite"] } ] 回答 1
Stack Overflow用户
发布于 2018-07-12 05:36:03
即使没有JQuery，也可以使用map方法来缩短代码：
text = choosePizzaInData[0].botten.map(function(v) {
return '<li>' + v + '</li>';
}).join('');
text = choosePizzaInData[1].topping.map(function(v) {
return '<li>' + v + '</li>';
}).join('');页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/51291956
复制相关文章
相似问题