在具有特定结构的更深层次的 for 循环中使用模数

Question

我正在尝试循环浏览我在文件夹中使用 php 命名的一些图像。这里的问题是我需要将图像放在特定的标记中，因为我将在轮播中动态地使用它们。

通常我只是循环浏览项目：

<div class="slider">
<?php
  for ($x = 0; $x <= 10; $x++) {
    if ($x == 0) {
      echo '<div class="slide active"><img src="img_'.$x.'"></div>';
    } else {
      echo '<div class="slide"><img src="img_'.$x.'"></div>';
    }
  }
?>
</div>

我尝试向每张幻灯片添加四张图片，使用模数计算并在它们之间添加标记：

<div class="slider">
  <div class="slide active">
  <?php
    for ($x = 0; $x <= 10; $x++) {
      if ($x % 4 == 0) {
        echo '<img src="img_'.$x.'"></div><div class="slide">';
      } else {
        echo '<img src="img_'.$x.'">';
      }
    }
  ?>
  </div>
</div>

我正在尝试使滑块与特定结构一起工作，其中图像嵌套在不同的 div 中，如下所示：

<div class="slider">
  <div class="slide active">
  <!-- -->
    <div class="slider-container">
      <div class="flexChild rowParent">
        <div class="flexChild flex-element"><img src="img_0.jpg"></div>
        <div class="flexChild columnParent">
          <div class="flexChild flex-element"><img src="img_1.jpg"></div>
          <div class="flexChild rowParent">
            <div class="flexChild flex-element"><img src="img_2.jpg"></div>
            <div class="flexChild flex-element"><img src="img_3.jpg"></div>
          </div>
        </div>
      </div>
    </div>
  <!-- -->
  </div>
</div>
<div class="slider">
  <div class="slide">
  <!-- -->
    <div class="slider-container">
      <div class="flexChild rowParent">
        <div class="flexChild flex-element"><img src="img_4.jpg"></div>
        <div class="flexChild columnParent">
          <div class="flexChild flex-element"><img src="img_5.jpg"></div>
          <div class="flexChild rowParent">
            <div class="flexChild flex-element"><img src="img_6.jpg"></div>
            <div class="flexChild flex-element"><img src="img_7.jpg"></div>
          </div>
        </div>
      </div>
    </div>
  <!-- -->
  </div>
</div>
<div class="slider">
  <div class="slide">
  <!-- -->
    <div class="slider-container">
      <div class="flexChild rowParent">
        <div class="flexChild flex-element"><img src="img_8.jpg"></div>
        <div class="flexChild columnParent">
          <div class="flexChild flex-element"><img src="img_9.jpg"></div>
          <div class="flexChild rowParent">
            <div class="flexChild flex-element"><img src="img_10.jpg"></div>
          </div>
        </div>
      </div>
    </div>
  <!-- -->
  </div>
</div>

我试过用这个结构遍历这些项目，但我没有成功。如果您对如何做到这一点有任何建议，我将不胜感激！我已经四处寻找这个，但我找不到任何结果。是否可以实现，或者我应该放弃它？

Answer 1

为了实现你想要的结构，我们需要使用两个循环：

<?php
    $result = '';
    $x = 0;
    $items = 10;
    while($x <= $items){
        if($x == 0){
            $result .= '<div class="slider"><div class="slide active"> <!-- --> <div class="slider-container"><div class="flexChild rowParent">';
        }else{
            $result .= '<div class="slider"><div class="slide"> <!-- --> <div class="slider-container"><div class="flexChild rowParent">';
        }           

        $result .= '<div class="flexChild flex-element"><img src="img_'.$x.'.jpg"></div>';
        $result .= '<div class="flexChild columnParent">';

        $result .= '<div class="flexChild flex-element"><img src="img_'.($x+1).'.jpg"></div>';
        $result .= '<div class="flexChild rowParent">';

        for($y=2; $y<=3; $y++){
            if(($x + $y) <= $items){
                $result .= '<div class="flexChild flex-element"><img src="img_'.($x+$y).'.jpg"></div>';
            }
        }

        $result .= '</div></div></div></div><!-- --></div></div>';
        $x += 4;
    }

    echo $result;
?>

在具有特定结构的更深层次的 for 循环中使用模数

Use modulus in for loops in deeper levels with specific structures

php

for-loop

operators

modulus