Question

应该将搜索值附加到nyt api上，并将for循环列出所有链接。由于某种原因，我只能得到一个结果，但是通过控制台查看时，我看到有100多个链接。

function myFunction(){
var citySearch = $("#city").val();

var NYTurl = "https://api.nytimes.com/svc/search/v2/articlesearch.json?q=" + citySearch +
"$sort=newest&api-key=xxxxxxxxxxxxxxxxxxxxxxxx"

jQuery.getJSON(NYTurl, function (data){
    var headlines = $("#headlines")
    var contentUrl = data.response.docs
    for(var i = 0; i < contentUrl.length; i++ ){
        contentUrlLoop = contentUrl[i];
        headlines.html('<a href="'+contentUrlLoop.web_url+'">Link</a>' );
    }
    console.log(data)
})

return false;

}

Answer 1

headlines.html(将传递的HTML字符串分配给headlines的内部HTML。因此，在每次迭代中，您都将覆盖headlines之前的内容。如果您想为响应中的每个项目插入append，请改用<a>：

headlines.append('<a href="'+contentUrlLoop.web_url+'">Link</a>' );

或者，而不是进行数百次DOM更改，您可以考虑使用单个HTML字符串并然后 append对其进行编码：

jQuery.getJSON(NYTurl, function(data) {
  var headlines = $("#headlines");
  var contentUrl = data.response.docs;
  var htmlStr = contentUrl.reduce(
    (a, { web_url }) => a + '<a href="' + web_url + '">Link</a>',
    ''
  );
  headlines.html('<a href="' + contentUrlLoop.web_url + '">Link</a>');
});

（也许也将它们用div括起来，以使每个链接都换行，或者加上a s块，以使HTML可读）

为什么我的for循环仅返回一个结果

1 个答案: