为什么这个for循环只打印一个元素？
为什么这个for循环只打印一个元素？
提问于 2019-11-16 19:19:29
你能帮我解决我在MDN上发现的这个问题吗？
var list = document.querySelector('.output ul');
var totalBox = document.querySelector('.output p');
var total = 0;
list.innerHTML = '';
totalBox.textContent = '';
var products = [
'Underpants:6.99',
'Socks:5.99',
'T-shirt:14.99',
'Trousers:31.99',
'Shoes:23.99'
];
for (var i = 0; i < products.length; i++) {
var subArray = products[i].split(':');
var name = subArray[0];
var price = Number(subArray[1]);
total += price;
itemText = name + ' — $' + price;
var listItem = document.createElement('li');
listItem.textContent = itemText;
list.appendChild(listItem);
}
totalBox.textContent = 'Total: $' + total.toFixed(2);<div class="output">
<ul></ul>
<p></p>
</div>
我理解其中的逻辑，但是当我在控制台上只编写下面这部分代码时，它只返回"Socks:5.99"
var products = [
'Underpants:6.99',
'Socks:5.99',
'T-shirt:14.99',
'Trousers:31.99',
'Shoes:23.99'
];
for (var i = 0; i < products.length; i++) {
var subArray = products[i].split(':');
var name = subArray[0];
var price = Number(subArray[1]);
}而subArray只包含该元素。看起来for循环不工作了。它不是应该给我一个完整的新数组吗？
Underpants — $6.99
Socks — $5.99
T-shirt — $14.99
Trousers — $31.99
Shoes — $23.99回答 1
Stack Overflow用户
发布于 2019-11-16 19:31:15
你的代码可以工作，你只需要将每次迭代的结果存储在某个地方，比如在一个新的数组中。下面是一个示例：
var products = [
'Underpants:6.99',
'Socks:5.99',
'T-shirt:14.99',
'Trousers:31.99',
'Shoes:23.99'
];
var formattedProducts = [];
for (var i = 0; i < products.length; i++) {
var subArray = products[i].split(':');
var name = subArray[0];
var price = Number(subArray[1]);
formattedProducts.push(name + ' - $' + price);
}
console.log(formattedProducts);
编辑
在您的第一个代码示例中，结果直接存储在.output ul列表元素内的DOM中：
var listItem = document.createElement('li');
listItem.textContent = itemText;
// list is defined outside the loop and will receive a new li element with the result of the iteration as textContent
list.appendChild(listItem);页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/58890146
复制相关文章
相似问题
腾讯云开发者
