Question

我正在工作twitch tv api.api调用我应该等于流媒体数组中的elemnts数量。但它是多次调用。我可以在codepen上看到它。

jsfiddle link https://jsfiddle.net/o48wwLdf/ HTML

javascript代码

$(document).ready(function() {
  var i;
  var streamers = ["ESL_SC2", "OgamingSC2", "cretetion", "freecodecamp", "storbeck", "habathcx", "RobotCaleb", "noobs2ninjas"];        //streamers array
  for (i = 0; i < streamers.length; i++) {
    jsoncall(streamers[i]);                            //calling function for api calls.
  }
});

function jsoncall(stream) {                            //function for api call
  $.getJSON('https://api.twitch.tv/kraken/streams/' + stream + '?callback=?', function(data) {
    if (data.stream === null) {                       //if channel is offline display offline
      $("p").append("<p>" + stream + "                                offline</p>");
    } else {                                    //if channel is online show what is he streaming.
      $("p").append("<p>" + stream + data.stream.game + "</p>");
    }
  });
}

Answer 1

执行此操作时：

$("p").append(...);

内容将附加到页面上的每个元素。由于您在内容中添加了更多个元素，因此您可以获得重复的内容。

Here's a forked version of your CodePen。我在主元素中添加了一个id。请注意，将附加到并不是真的有意义; 个元素不能像其他元素一样包含块级元素。浏览器允许它。那么，HTML：

<p id=main></p>

更新的JavaScript：

function jsoncall(stream) {
  $.getJSON('https://api.twitch.tv/kraken/streams/' + stream + '?callback=?', function(data) {
    if (data.stream === null) {
      $("#main").append("<p>" + stream + "                                offline</p>");
    } else {
      $("#main").append("<p>" + stream + data.stream.game + "</p>");
    }
  });
}

api调用正在运行意外的次数

1 个答案: