Question

我正在使用Instagram api，我从服务器获取信息，包括用户配置文件和另外两种。我想把信息放在html的表格中。每行都与用户名相关（因为我搜索了用户名），每行都有个人资料和两件事。我对如何做到这一点感到有点困惑。

这是我的代码：

var searchUsers = function(query,count){

$.ajax({
  type: "GET",
  dataType: "jsonp",
  cache: false,
  data: {
    q: query,
    count: count,
    access_token: access_token,
  },
  url: "https://api.instagram.com/v1/users/search",
  success: function(data) {
    // placing the images on the page
    console.log(data);
    if (data.data.length>0){
        var resultShow = $("#users_result");
        for (var i in data.data){

            resultShow.append("<img src='" +      data.data[i].profile_picture + "'></img>");
            // var username = "https://www.instagram.com/"+ data.data[i].username;
            // console.log(username);
            resultShow.append("<a target='_blank' href = 'https://www.instagram.com/"+data.data[i].username+"'>user profile</a>");
            // var id = data.data[i].id;
            // console.log(id);
          $.ajax({
          url: 'https://api.instagram.com/v1/users/' + data.data[i].id + '/media/recent/',
          type: "GET",
          dataType: "jsonp",
          data: {access_token: access_token},
          success: function(data2){
            console.log(data2);
          for(x in data2.data){
            // console.log(data2.data[x].link);
            resultShow.append("<a target='_blank' href = '"+data2.data[x].link+"'><img src='" + data2.data[x].images.thumbnail.url + "'></img></a>");  
              }

          },
          error: function(data2){
            console.log(data2);
          }
          });
    }
    } else {
        resultShow.html("Noting found!");
    }
    },
     error: function(data){
    console.log(data);
}      
});
};

Answer 1

您可以使用innerHTML属性更改页面中的几乎任何值。实施例：document.getElementById("demo").innerHTML = "Paragraph changed!"; http://jsfiddle.net/blazeeboy/fNPvf/

要更改表格内的值，只需为其指定一个ID，然后使用您的Javascript函数进行更改。在您的情况下，我建议在第31行和第32行之间插入任何Javascript参数。

 success: function(data2){
    var title = document.getElementById('title');
    var username = "https://www.instagram.com/"+ data.data[i].username;
    title.innerHTML = username;
            console.log(data2);
          for(x in data2.data){
            // console.log(data2.data[x].link);
            resultShow.append("<a target='_blank' href = '"+data2.data[x].link+"'><img src='" + data2.data[x].images.thumbnail.url + "'></img></a>");  
              }

          }

它会将用户名写入id为“title”的表中，如果需要多个表值，则需要创建一个数组并使用for循环将特定值插入到特定的表中，tr等等... id

success: function(data2){
    //tableids are the ids of each table row or column in the order you wanna write them
var tableids = ['0', '1', '2'];//starting at 0
var username = "https://www.instagram.com/"+ data.data[i].username;
var title = document.getElementById(tableids[i]);
title.innerHTML = username;
        console.log(data2);
      for(x in data2.data){
            // console.log(data2.data[x].link);
        resultShow.append("<a target='_blank' href = '"+data2.data[x].link+"'><img src='" + data2.data[x].images.thumbnail.url + "'></img></a>");  
          }

      }

希望它足够清楚

将收到的信息插入到html表格中

1 个答案: