メンテナンスを簡単に！配列を使って画像に対応した文章を表示させる【PHP】

画像とその画像に対応した文章を繰り返して表示するHTMLをPHPですっきりさせました。

元のHTML

<div>
 <div class="img"><img src="img01.jpg"></div>
 <div class="text">
   <p>文章その1</p>
 </div>
</div>
<div>
 <div class="img"><img src="img02.jpg"></div>
 <div class="text">
   <p>文章その2</p>
 </div>
</div>
.
.
.

その①画像と文章をそれぞれ配列に入れる

とりあえず手を動かさないと始まらないので、思いつくままに書いたのがこれ

sample.php

<?php
$image = ['img01.jpg','img02.jpg'];
$text = ['文章その1','文章その2'];
include 'inc/repeat.php';
?>

inc/repeat.php

<?php
for ($i=0; $i<count($image); $i++){
?>
 <div>
  <div class="img"><img src="<?php echo $image[$i]; ?>"></div>
  <div class="text">
   <p><?php echo $text[$i]; ?></p>
  </div>
 </div>
<?php 
} 
?>

画像と文章をそれぞれ配列に入れて、配列の0番目から配列の終わりまで繰り返す方法。

書く前から分かってたけど、これだと配列の順番が同じというだけで結びつきがないので差し替えるときにうっかり画像と文章がずれる可能性もありそうだなーと。
配列に配列を入れる、いわゆる多次元配列も考えたけど、多次元配列の良さを活かせてない気がしてもやもや……。

その②連想配列を使う方法 ☆こちらがオススメ

連想配列ならいけそうな気がしてたけど、パッとは思いつかなくて、しばらく考えたり調べたりして出来上がったのかこれ。

sample.php

<?php
$mix_up = [
 'img01.jpg'
 =>'文章その1',
 'img02.jpg'
 =>'文章その2'
];
include 'inc/repeat.php';
?>

inc/repeat.php

<?php
foreach($repeat as $key => $value){
?>
 <div>
  <div class="img"><img src="<?php echo $key; ?>"></div>
  <div class="text">
   <p><?php echo $value; ?></p>
  </div>
 </div>
<?php 
}
?>

連想配列のキーに画像のURL、値に文章を入れるパターン。
連想配列ならキーも取り出せるのでこれならいけそう……というわけで、いけました。

これならキーと値で結びついてるし、コードも見やすいからいいんじゃないかなと。
連想配列使ったらうまくいきそうな気がしてたけど、こういう使い方をさくっと思いつくようになりたいな。