Определите первые и последние два сообщения - PullRequest
0 голосов
/ 19 сентября 2018

Я использую приведенный ниже скрипт, чтобы показать последние 5 сообщений в моем блоге Blogger.Как мне обернуть первые и последние 2 сообщения в разные контейнеры div?В настоящее время все 5 сообщений находятся внутри контейнера-обертки, хранящегося в переменной item:

<script type='text/javascript'>
  function mycallback(json) {
    for (var i = 0; i < json.feed.entry.length; i++) {
      for (var j = 0; j < json.feed.entry[i].link.length; j++) {
        if (json.feed.entry[i].link[j].rel == 'alternate') {
          var postUrl = json.feed.entry[i].link[j].href;
          break;
        }
      }
      var postTitle = json.feed.entry[i].title.$t;
      var postAuthor = json.feed.entry[i].author[0].name.$t;
      var postSummary = json.feed.entry[i].summary.$t;
      var entryShort = postSummary.substring(0,400);
      var entryEnd = entryShort.lastIndexOf(" ");
      var postContent = entryShort.substring(0, entryEnd) + '...';
      var postImage = json.feed.entry[i].media$thumbnail.url.replace('s72-c/','s1600/');
      var item = '<div class="wrapper"><img src="' + postImage + '"/><h3><a href=' + postUrl + '>' + postTitle + '</h3></a><span>'+ postAuthor + '</span><p>' + postContent + '</p></div>';
      document.write(item);
    }
  }
</script>
<script src="/feeds/posts/summary?orderby=published&max-results=5&alt=json-in-script&callback=mycallback"></script>

Ответы [ 2 ]

0 голосов
/ 19 сентября 2018

Более общее решение не будет проверять последние и предыдущие элементы, проверяя наличие 3 или 4 элементов, но должно основываться на общей длине ваших сообщений (это может быть 3, это может быть 10000).

Следующие проверки должны быть в вашем цикле.

if(i === 0 || i === 1)

Всегда используйте оператор ===, поскольку он безопасен для типов.Также сгруппируйте ваши чеки так, чтобы их было легко понять (чек для первого и второго в одном if и для последнего и предыдущего для последнего в другом if:

if(i === json.feed.entry.length || i === json.feed.entry.length - 1) - этот чек основанпо длине ваших записей, а не по некоторым фиксированным значениям, таким как 3 или 4.

Таким образом, если отображаемое значение записей изменится в будущем (например, до 10), вам не нужно корректировать свой код здесь.Весь код, который вы пишете, должен стремиться работать без таких настроек, когда код, который он использует, изменяется.

0 голосов
/ 19 сентября 2018

Проверьте нужные элементы с помощью цикла

// to check first or fourth element
if (i == 0 || i == 3)
// to check second or fifth element
if (i == 1 || i == 4)

Оберните их, добавив HTML-теги

<script type='text/javascript'>
  function mycallback(json) {
    for (var i = 0; i < json.feed.entry.length; i++) {
      for (var j = 0; j < json.feed.entry[i].link.length; j++) {
        if (json.feed.entry[i].link[j].rel == 'alternate') {
          var postUrl = json.feed.entry[i].link[j].href;
          break;
        }
      }
      var postTitle = json.feed.entry[i].title.$t;
      var postAuthor = json.feed.entry[i].author[0].name.$t;
      var postSummary = json.feed.entry[i].summary.$t;
      var entryShort = postSummary.substring(0,400);
      var entryEnd = entryShort.lastIndexOf(" ");
      var postContent = entryShort.substring(0, entryEnd) + '...';
      var postImage = json.feed.entry[i].media$thumbnail.url.replace('s72-c/','s1600/');
      var item = '<div class="wrapper"><img src="' + postImage + '"/><h3><a href=' + postUrl + '>' + postTitle + '</h3></a><span>'+ postAuthor + '</span><p>' + postContent + '</p></div>';
      if (i == 0 || i == 3) document.write('<div>');
      document.write(item);
      if (i == 1 || i == 4) document.write('</div>');
    }
  }
</script>
<script src="/feeds/posts/summary?orderby=published&max-results=5&alt=json-in-script&callback=mycallback"></script>
...