为每个imdb评级jquery生成等效的svg星

时间:2016-10-26 05:49:11

标签: javascript jquery

我从omdb json对象获取imdb评级,并尝试为每个评级生成等效的svg星。

在我的例子中,该电影的评分为8.0。我不知道为什么但是在我的代码中,目前我正在用克隆生成11颗星。或者,我想我可以使用一系列星星为每个评级添加多个星星。我有30部电影评分不同。如何为每个评级生成等效的星星?

$( document ).ready(function() {

movie = {
Title: "The Exorcist",
Year: "1973",
Metascore: "82",
imdbRating: "8.0",
}
  // red star
  const $star = $(`<svg width="75" height="50"><polygon points="25,2.5, 10,49 47.5,17.5, 2.5,17.5,40,49" style="fill:red;stroke:none;stroke-width:5;"/></svg>`);

  // movie rating
  const rate = parseInt(movie.imdbRating);
  $(".row").text(`Movie IMDB Rating: ${rate}`);

  // 10 star array
  const ratingStars =[$star,$star,$star,$star,$star,$star,$star,$star,$star,$star];

 for(let i = 0; i <= ratingStars.length; i++) {
  if(rate === 8 ) {
   $star.clone().appendTo($("#star"));
 }
}

});

1 个答案:

答案 0 :(得分:0)

你想做的是

for(let i = 0; i < rate; i++) {
    $star.clone().appendTo($("#star"));
}

所以,如果费率是8.0到8.999,那你得到8星