[英]Nested For Loops - Javascript
我有一个问题与我在这里提出的问题有关
我正在尝试嵌套一个循环,但不确定是否要这样做。 我想做的是显示一些与分数相关的星星。 因此,如果他们有3个问题,他们将获得3星。 我遇到的麻烦是,如果空星未达到要求的分数,则会显示它们。
EG:达到下一个等级需要10分。 他们得到6分。我可以显示6个金星,但是我无法显示4个空星。 我希望我能解释这个权利。
这是我到目前为止的代码
var se = '';
var sep = '';
for (var i = 1; i <= score; i++)
{
se = se + '<img src="./images/star.png"/>';
}
我也有这个循环试图显示空星星
for (var j = 1; j <= i; j++)
{
sep = sep + '<img src="./images/emptystar.png"/>';
}
我不确定这是否需要进入已经存在的for循环中或将其退出。 另外,由于某种原因,它不会显示正确数量的空星。 它显示1个空白代表0个正确答案,其余3个或4个代表
我认为我在第二个循环中进行了正确的计算。 我会出错的任何指针将不胜感激。 就像我说的,第一个循环可以正常工作。
感谢大家
尝试这个:
var stars = '';
for (var i = 1; i <= 10; i++) { // Loop 10 times
var empty = (i > score)?'empty':''; // If i > score, set this variable to the string 'empty';
stars += '<img src="./images/'+ empty +'star.png"/>'; // Add the image (star.png or emptystar.png depending on the score).
}
这样做的好处是您只需要1个循环,这意味着您无需复制任何代码。
对于score == 6
,将返回:
<img src="./images/star.png"/>
<img src="./images/star.png"/>
<img src="./images/star.png"/>
<img src="./images/star.png"/>
<img src="./images/star.png"/>
<img src="./images/star.png"/>
<img src="./images/emptystar.png"/>
<img src="./images/emptystar.png"/>
<img src="./images/emptystar.png"/>
<img src="./images/emptystar.png"/>
那么,那行var empty = (i > score)?'empty':'';
工作,你在问吗?
很简单,它是一个三元运算符 。 简写:
var empty;
if(i > score){
empty = 'empty';
}else{
empty = '';
}
尝试这个:
var stars = '';
var maxstars = 10;
for (var i = 0; i < score; i++)
{
stars = stars + '<img src="./images/star.png"/>';
}
for (var j = score; j < maxstars; j++)
{
stars = stars + '<img src="./images/emptystar.png"/>';
}
只需使用一个循环:
var score = 5;
var sep = "";
for (var i = 0; i <= 10; i++)
{
sep += (i < score) ? '<img src="./images/star.png"/>' : '<img src="./images/emptystar.png"/>';
}
我没有测试,但这应该可以帮助您入门。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.