javascript - 如何将 php 中接收到的数据分类为 html 中的 3 个不同的 div 标签？

Question

我使用 php 来收集我的 instagram 提要，但是 php 使用 instagram api 收集的所有图像都放在相同的位置(或相同的 div)，所以我收到了我的图像

<?php foreach ($result->data as $post): ?>
<div class="images">
<!-- Renders images. @Options (thumbnail,low_resoulution,high_resolution)-->
<a class="group" rel="group1" href="<?= $post->images->standard_resolution->url ?>"><img src="<?= $post->images->thumbnail->url ?>"></a>
<?php endforeach ?> </div>

所以所有收集到的图像都变成链接并全部放在 div 图像中，所以我想做的是使用 php 或 js 将收到的所有 20 张图像平均分配到这 3 个不同的 div 中。

<div class="col-md-4"></div>,
<div class="col-md-4"></div>,
<div class="col-md-4"></div>

这是我的第一篇文章，代码可能很笨拙。感谢您的帮助。

Answer 1

好吧，我已经建立了一个合适的完整解决方案。它的工作原理是首先构建一个响应对象数组，然后将它们分块进行显示。如果您想将它们分开，您肯定需要将它们放入一个子缓冲区中，例如您在下面看到的 $results 缓冲区。

<?php 
    $results = array();
    foreach ($result->data as $post): 
        // Using output buffering as a simple means of building HTML.
        ob_start();
?>
    <a class="group" rel="group1" href="<?= $post->images->standard_resolution->url ?>">
        <img src="<?= $post->images->thumbnail->url ?>">
    </a>
<?php
        $results[] = ob_get_contents();
        ob_end_clean();
    endforeach;

    // Now we have an array of elements as HTML.  We'll chunk them
    // into 3 arrays.  We could also randomize or other things here.
    $chunked = array_chunk($results, 3);
?>
<div class="col-md-4"><?=implode("\n", $chunked[0])?></div>
<div class="col-md-4"><?=implode("\n", $chunked[1])?></div>
<div class="col-md-4"><?=implode("\n", $chunked[2])?></div>