PHP根据二维数组值生成动态HTML

Question

我有以下一维关联内部数组的$MessagesArray PHP 二维索引数组：

Array
(
    [0] => Array
        (
            [id] => 1
            [from] => Person 1
            [to] => Person 2
            [platform] => Instagram Direct Messaging
            [date] => 2016/11/27
            [time] => 11:00
            [ampm] => AM
            [specialcontent] => none
            [content] => Hello
        )

    [1] => Array
        (
            [id] => 2
            [from] => Person 1
            [to] => Person 2
            [platform] => Instagram Direct Messaging
            [date] => 2016/11/27
            [time] => 11:00
            [ampm] => AM
            [specialcontent] => none
            [content] => How are you?
        )

    [2] => Array
        (
            [id] => 3
            [from] => Person 2
            [to] => Person 1
            [platform] => Instagram Direct Messaging
            [date] => 2016/11/27
            [time] => 6:00
            [ampm] => PM
            [specialcontent] => none
            [content] => Oh, hey there. I'm fine
        )

    [3] => Array
        (
            [id] => 4
            [from] => Person 2
            [to] => Person 1
            [platform] => Instagram Direct Messaging
            [date] => 2016/11/27
            [time] => 6:01
            [ampm] => PM
            [specialcontent] => none
            [content] => What about you?
        )

    [4] => Array
        (
            [id] => 5
            [from] => Person 1
            [to] => Person 2
            [platform] => Instagram Direct Messaging
            [date] => 2016/11/28
            [time] => 8:00
            [ampm] => AM
            [specialcontent] => none
            [content] => It's been a while.
        )

    [5] => Array
        (
            [id] => 6
            [from] => Person 1
            [to] => Person 2
            [platform] => Instagram Direct Messaging
            [date] => 2016/11/30
            [time] => 2:00
            [ampm] => PM
            [specialcontent] => none
            [content] => Hello?
        )

    [6] => Array
        (
            [id] => 7
            [from] => Person 2
            [to] => Person 1
            [platform] => Instagram Direct Messaging
            [date] => 2016/12/01
            [time] => 3:00
            [ampm] => PM
            [specialcontent] => none
            [content] => Sorry, I'm traveling 'till next year.
        )

    [7] => Array
        (
            [id] => 8
            [from] => Person 1
            [to] => Person 2
            [platform] => Instagram Direct Messaging
            [date] => 2016/12/05
            [time] => 1:00
            [ampm] => PM
            [specialcontent] => none
            [content] => Fine by me.
        )

    [8] => Array
        (
            [id] => 9
            [from] => Person 2
            [to] => Person 1
            [platform] => Instagram Direct Messaging
            [date] => 2017/01/04
            [time] => 3:00
            [ampm] => PM
            [specialcontent] => none
            [content] => I'm back.
        )

    [9] => Array
        (
            [id] => 10
            [from] => Person 1
            [to] => Person 2
            [platform] => Instagram Direct Messaging
            [date] => 2018/01/15
            [time] => 1:00
            [ampm] => PM
            [specialcontent] => none
            [content] => I'm back too, one year later too.
        )

)

谁的实际代码是（虽然我实际上从 XML 文件中的数据库创建了以前的数组）：

<?php
    $MessagesArray = array(
        array(
            "id" => "1",
            "from" => "Person 1",
            "to" => "Person 2",
            "platform" => "Instagram Direct Messaging",
            "date" => "2016/11/27",
            "time" => "12:00",
            "ampm" => "AM",
            "specialcontent" => "none",
            "content" => "Hello"
        ),
        array(
            "id" => "2",
            "from" => "Person 1",
            "to" => "Person 2",
            "platform" => "Instagram Direct Messaging",
            "date" => "2016/11/27",
            "time" => "11:00",
            "ampm" => "AM",
            "specialcontent" => "none",
            "content" => "How are you?"
        ),
        array(
            "id" => "3",
            "from" => "Person 2",
            "to" => "Person 1",
            "platform" => "Instagram Direct Messaging",
            "date" => "2016/11/27",
            "time" => "6:00",
            "ampm" => "PM",
            "specialcontent" => "none",
            "content" => "Oh, hey there. I'm fine"
        ),
        array(
            "id" => "4",
            "from" => "Person 2",
            "to" => "Person 1",
            "platform" => "Instagram Direct Messaging",
            "date" => "2016/11/27",
            "time" => "6:01",
            "ampm" => "PM",
            "specialcontent" => "none",
            "content" => "What about you?"
        ),
        array(
            "id" => "5",
            "from" => "Person 1",
            "to" => "Person 2",
            "platform" => "Instagram Direct Messaging",
            "date" => "2016/11/28",
            "time" => "8:00",
            "ampm" => "AM",
            "specialcontent" => "none",
            "content" => "It's been a while."
        ),
        array(
            "id" => "6",
            "from" => "Person 1",
            "to" => "Person 2",
            "platform" => "Instagram Direct Messaging",
            "date" => "2016/11/30",
            "time" => "2:00",
            "ampm" => "PM",
            "specialcontent" => "none",
            "content" => "Hello?"
        ),
        array(
            "id" => "7",
            "from" => "Person 2",
            "to" => "Person 1",
            "platform" => "Instagram Direct Messaging",
            "date" => "2016/12/01",
            "time" => "3:00",
            "ampm" => "PM",
            "specialcontent" => "none",
            "content" => "Sorry, I'm traveling 'till next year."
        ),
        array(
            "id" => "8",
            "from" => "Person 1",
            "to" => "Person 2",
            "platform" => "Instagram Direct Messaging",
            "date" => "2016/12/05",
            "time" => "1:00",
            "ampm" => "PM",
            "specialcontent" => "none",
            "content" => "Fine by me."
        ),
        array(
            "id" => "9",
            "from" => "Person 2",
            "to" => "Person 1",
            "platform" => "Instagram Direct Messaging",
            "date" => "2017/01/04",
            "time" => "3:00",
            "ampm" => "PM",
            "specialcontent" => "none",
            "content" => "I'm back."
        ),
        array(
            "id" => "10",
            "from" => "Person 1",
            "to" => "Person 2",
            "platform" => "Instagram Direct Messaging",
            "date" => "2018/01/15",
            "time" => "1:00",
            "ampm" => "PM",
            "specialcontent" => "none",
            "content" => "I'm back too, one year later too."
        )
    );
?>

我想以某种方式有一个自动创建 HTML 的代码，如下例所示：

<div class="year">
  2016
  <div class="month">
    Month 11
    <div class="day">
      Day 27
    </div>
    <div class="day">
      Day 28
    </div>
    <div class="day">
      Day 30
    </div>
  <div class="month">
    Month 12
    <div class="day">
      Day 01
    </div>
    <div class="day">
      Day 05
    </div>
  </div>
  </div>
</div>
<div class="year">
  2017
  <div class="month">
    Month 01
    <div class="day">
      Day 04
    </div>
  </div>
</div>
<div class="year">
  2018
  <div class="month">
    Month 01
    <div class="day">
      Day 15
    </div>
  </div>
</div>

正如您所看到的，这并不是那么难，我只是在弄清楚如何使用嵌套的foreach函数时遇到了问题。

代码应该为每个唯一的年份生成一个<div> HTML 元素，然后为该年的每个唯一月份生成其相应的<div> HTML 元素，然后同时为该年的每一天生成相应的<div> HTML 元素那年的月份。

我认为我们需要使用嵌套的foreach函数。 假设我们有代码foreach ($MessagesArray as $item) {} ，那么，在函数内部，我们可以获得年、月和日作为 $ year = substr($item['date'], 0, 4); , $month = substr($item['date'], 5, 2); , 和$day = substr($item['date'], 8, 2); ， 分别。 我还认为我们需要有人知道上一次迭代的价值。

Answer 1

是的，您需要编写知道前一行数据的代码。 这可以通过单个循环和一些逻辑定位的条件语句来完成。

代码：（演示）

$MessagesArray = [
    ["date" => "2016/11/27"],
    ["date" => "2016/11/27"],
    ["date" => "2016/11/27"],
    ["date" => "2016/11/27"],
    ["date" => "2016/11/28"],
    ["date" => "2016/11/30"],
    ["date" => "2016/12/01"],
    ["date" => "2016/12/05"],
    ["date" => "2017/01/04"],
    ["date" => "2018/01/15"]
];
$yr = null;
$mo = null;
$dy = null;

foreach ($MessagesArray as $row) {
    if ($row["date"] == "$yr/$mo/$dy") {
        continue;  // if repeat of previous date, move to next iteration
    }
    [$y, $m, $d] = explode("/", $row["date"]);
    if (($m != $mo || $y != $yr) && $mo !== null) {
        echo "</div>";
    }
    if ($y != $yr) {
        if ($yr !== null) {
            echo "</div>";
        }
        echo "<class='year'>$y";
    }
    if ($m != $mo || $y != $yr) {
        echo "<div class='month'>Month $m";
    }
    echo "<div class='day'>Day $d</div>";
    $yr = $y;
    $mo = $m;
    $dy = $d;
}
if (sizeof($MessagesArray)) {
    echo "</div></div>";
}

输出：

<div class='year'>2016
    <div class='month'>Month 11
        <div class='day'>Day 27</div>
        <div class='day'>Day 28</div>
        <div class='day'>Day 30</div>
    </div>
    <div class='month'>Month 12
        <div class='day'>Day 01</div>
        <div class='day'>Day 05</div>
    </div>
</div>
<div class='year'>2017
    <div class='month'>Month 01
        <div class='day'>Day 04</div>
    </div>
</div>
<div class='year'>2018
    <div class='month'>Month 01
        <div class='day'>Day 15</div>
    </div>
</div>

Answer 2

重新格式化您的阵列：

$formatted = [];

foreach ($MessagesArray as $Message) {
    $year = substr($Message['date'], 0, 4);
    $month = substr($Message['date'], 5, 2);
    $formatted[ $year ][ $month ][] = $Message;
}

print_r($formatted);

然后它就像循环一样简单：

foreach ($formatted as $year => $months) {
    //Echo year text
    foreach ($months as $month => $messages) {
        //Echo month text
        foreach ($messages as $message) {
            //Echo each text
        }
    }
}

看到这个 php 游乐场。

Answer 3

这是一个天真的方法：

$messages = [
    ["date" => "2016/11/27"],
    ["date" => "2016/11/27"],
    ["date" => "2016/11/27"],
    ["date" => "2016/11/27"],
    ["date" => "2016/11/28"],
    ["date" => "2016/11/30"],
    ["date" => "2016/12/01"],
    ["date" => "2016/12/05"],
    ["date" => "2017/01/04"],
    ["date" => "2018/01/15"]
];

$parsed = [];

foreach ($messages as $k => $v) {
    [$y, $m, $d] = explode("/", $v["date"]);
    $parsed[$y][$m][$d] = 1;
}

$html = [];

foreach ($parsed as $y => $v) {
    $html[] = "<div class='year'>$y";
    
    foreach ($v as $m => $v) {
        $html[] = "<div class='month'>Month $m";

        foreach ($v as $d => $v) {
            $html[] = "<div class='day'>Day $d</div>";
        }
      
        $html[] = "</div>";
    }

    $html[] = "</div>";
}

echo implode($html);

输出：

<div class="year">2016<div class="month">Month 11<div class="day">Day 27</div><div class="day">Day 28</div><div class="day">Day 30</div></div><div class="month">Month 12<div class="day">Day 01</div><div class="day">Day 05</div></div></div><div class="year">2017<div class="month">Month 01<div class="day">Day 04</div></div></div><div class="year">2018<div class="month">Month 01<div class="day">Day 15</div></div></div>

解释：

在一个循环中解析结构，然后再次循环以生成 HTML。 请注意，我简化了您的数据结构，但只要“日期”键存在，它就可以在任何其他结构上工作。 此外，HTML 被缩小但相同——如果你想要一个漂亮的版本，那也没什么麻烦。