导入JSON到html（表格）过滤结果答案

【问题标题】：Import JSON to html (table) filtering results导入JSON到html（表格）过滤结果
【发布时间】：2018-04-28 22:19:46
【问题描述】：

我正在尝试将 JSON 数据导入 html 表。我有不同类型的数据。就我而言，我只需要在表中查看“链接”数据类型，这是我得到的 JSON 数据。

  {   "data": [
  {
     "type": "photo",
     "created_time": "2017-11-15T14:30:43+0000",
     "permalink_url": "https://www.facebook.com/LaFokaES/posts/693061044378702",
     "shares": {
        "count": 2270
     },
     "id": "104957429855736_693061044378702"
  },
  {
     "type": "link",
     "created_time": "2017-11-15T02:34:46+0000",
     "permalink_url": "https://www.facebook.com/LaFokaES/posts/692656794419127",
     "shares": {
        "count": 86
     },
     "id": "104957429855736_692656794419127"
  },
  {
     "type": "photo",
     "created_time": "2017-11-15T00:34:50+0000",
     "permalink_url": "https://www.facebook.com/LaFokaES/posts/692493157768824",
     "shares": {
        "count": 1628
     },
     "id": "104957429855736_692493157768824"
  },
  {
     "type": "photo",
     "created_time": "2017-11-14T23:51:53+0000",
     "permalink_url": "https://www.facebook.com/LaFokaES/posts/692442954440511",
     "shares": {
        "count": 6239
     },
     "id": "104957429855736_692442954440511"

这是我的代码：

   <body>
    <input type="text" class="txtPagina">
    <button class="btnBuscar">Buscar</button>
    <table class="tabla" border='1'>
         <tr>

             <td>Type</td>
          <td>created time</td>
             <td>permalink url</td>
             <td>Shares Count</td>


         </tr>
    </table>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>


     $(document).ready(function(){
            $('.btnBuscar').on('click', function (){
                var pagina = $('.txtPagina').val();
            //Ajax
            $.ajax({
                type: "GET",
                dataType: "json",
                url: "https://graph.facebook.com/"+pagina+"/feed?fields=type,created_time,permalink_url,shares&limit=25& access_token=(mytoken)",
                success: function(data){


     $.each(data.data, function(i, d){
        var s = d.shares ? '<td>'+d.shares.count+'</td>' : '';
        $('.tabla').append('<tr><td>'+d.type+'</td><td>'+d.created_time+'</td><td>'+d.permalink_url+'</td>'+s+'</tr>');
      });
    },
                    error: function (){
                        console.log("Error");

这是我得到的结果：

如您所见，我正在获取照片和链接，但我只需要查看链接。

【问题讨论】：

'<a href="'+d.permalink_url+'>'+d.permalink_url+'</a>' 不够吗？
“我只需要查看链接”是什么意思？不是你自己的代码吗？改变它，让它向你展示你想要的东西。

标签： javascript html json import html-table

【解决方案1】：

只需在循环中添加 if 语句即可过滤掉照片。

 $.each(data.data, function(i, d){
      if(d.type =='link'){
      var s = d.shares ? '<td>'+d.shares.count+'</td>' : '';
    $('.tabla').append('<tr><td>'+d.type+'</td><td>'+d.created_time+'</td><td>'+d.permalink_url+'</td>'+s+'</tr>');
    }
  });

【讨论】：

【解决方案2】：

在你的每个循环中：

if(d.type == 'link') {
    //Add as you already do
}

完成！

【讨论】：